/* bloco 0 */

:root{--red:#d21f1f;--tiff:#0ABAB5;--yellow:#F2C230;--bg:#0a0a0a;--muted:#9a9a9a;--line:#2a2a2a}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;overscroll-behavior-y:none}
body{overscroll-behavior-y:none}
body{background:var(--bg);color:#eee;font-family:'Oswald',sans-serif;font-weight:300;overflow-x:hidden;overflow-x:clip}
a{color:inherit;text-decoration:none}
.racing{font-family:'Racing Sans One',cursive}

/* ===================== MENU DE ENTRADA (estilo jogo) ===================== */
.menu-screen{
  position:relative;min-height:100vh;min-height:100dvh;display:flex;align-items:center;
  padding:clamp(96px,13vh,150px) 0 60px;
  background:linear-gradient(90deg,rgba(8,8,8,.96) 0%,rgba(8,8,8,.72) 34%,rgba(8,8,8,.28) 62%,rgba(8,8,8,.5) 100%),
             url('/assets/MENU_BG.jpg') center center/contain no-repeat #0a0a0a;
  overflow:hidden;
}
/* No celular/tablet a arte do menu passa a PREENCHER a tela: com "contain" sobrava
   faixa vazia em cima/embaixo e dava pra ver a camada de tras ao arrastar. */
@media (max-width:1024px){
  .menu-screen{
    background:linear-gradient(90deg,rgba(8,8,8,.92) 0%,rgba(8,8,8,.62) 38%,rgba(8,8,8,.34) 66%,rgba(8,8,8,.58) 100%),
               url('/assets/MENU_BG.jpg') center center/cover no-repeat #0a0a0a !important;
    background-attachment:scroll !important;
  }
}
.menu-screen::after{ /* grão/vinheta */
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse at 70% 50%,transparent 40%,rgba(0,0,0,.7) 100%);
}
.menu-inner{position:relative;z-index:3;padding:0 clamp(24px,6vw,90px);max-width:560px;perspective:900px}
.menu-logo{width:clamp(210px,22vw,300px);height:auto;max-height:170px;object-fit:contain;display:block;margin:0 0 22px;filter:drop-shadow(0 6px 24px rgba(210,31,31,.45))}
.menu-tag{font-family:'Racing Sans One',cursive;font-size:clamp(14px,1.7vw,20px);letter-spacing:1px;color:#fff;text-transform:uppercase;margin-bottom:34px;font-style:italic}
.menu-tag b{color:var(--red)}
.menu-label{font-size:11px;letter-spacing:4px;text-transform:uppercase;color:var(--muted);margin-bottom:16px;font-style:italic}
.menu-label::before{content:"» ";color:var(--yellow)}

.mw-menu{list-style:none;display:flex;flex-direction:column;gap:9px;transform-style:preserve-3d}
.mw-menu li{position:relative}
.mw-menu button{
  all:unset;cursor:pointer;display:flex;align-items:center;gap:14px;
  width:100%;padding:11px 18px;font-family:'Oswald';font-weight:600;
  font-size:clamp(15px,1.5vw,19px);text-transform:uppercase;letter-spacing:1.2px;
  color:#dcdcdc;font-style:italic;position:relative;box-sizing:border-box;border-radius:9px;
  background:linear-gradient(160deg,#242427 0%,#161618 60%,#101012 100%);
  border:1px solid rgba(255,255,255,.08);
  border-top-color:rgba(255,255,255,.18);border-bottom-color:rgba(0,0,0,.6);
  box-shadow:0 5px 0 -1px #0b0b0c, 0 8px 14px -4px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.06);
  transform:translateZ(0);transition:transform .16s ease, box-shadow .16s ease, background .16s ease, color .16s ease;
}
.mw-menu button .idx{font-size:.66em;color:var(--yellow);font-weight:700;min-width:26px;opacity:.9;font-style:normal;letter-spacing:1px;
  text-shadow:0 1px 0 rgba(0,0,0,.8)}
.mw-menu button::after{ /* faísca dourada lateral */
  content:"";position:absolute;left:0;top:0;bottom:0;width:3px;border-radius:9px 0 0 9px;
  background:linear-gradient(180deg,var(--yellow),var(--red));opacity:0;transition:.16s;
}
.mw-menu button:hover,.mw-menu button:focus-visible{
  color:#fff;background:linear-gradient(160deg,#2f2f33 0%,#1c1c1f 60%,#141416 100%);
  transform:translateY(-2px) translateX(6px) rotateX(6deg) rotateY(-3deg);
  box-shadow:0 9px 0 -1px #0b0b0c, 0 16px 24px -6px rgba(210,31,31,.35), inset 0 1px 0 rgba(255,255,255,.12);
}
.mw-menu button:hover::after,.mw-menu button:focus-visible::after{opacity:1}
.mw-menu button:active{
  transform:translateY(3px) translateX(6px);
  box-shadow:0 1px 0 -1px #0b0b0c, 0 3px 8px -3px rgba(0,0,0,.8), inset 0 2px 6px rgba(0,0,0,.5);
}
@media(max-height:760px){.menu-logo{max-height:120px;margin-bottom:14px}.mw-menu{gap:6px}.mw-menu button{padding:8px 16px;font-size:clamp(14px,1.4vw,17px)}.menu-screen{padding-top:clamp(84px,11vh,120px)}}
.scroll-hint{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:3;
  font-size:11px;letter-spacing:3px;text-transform:uppercase;color:var(--muted);animation:bob 1.8s infinite}
@keyframes bob{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,8px)}}

/* ===================== SEÇÕES DE CONTEÚDO ===================== */
.section{min-height:100vh;padding:80px clamp(24px,6vw,80px) 90px;position:relative;scroll-margin-top:0}
.section-band{ /* faixa superior com imagem - mostra 1920x400 inteiro, sem corte */
  position:absolute;top:0;left:0;right:0;width:100%;max-width:100%;aspect-ratio:1920/400;overflow:hidden;z-index:0;line-height:0;
}
html,body{overflow-x:hidden;overflow-x:clip}
/* rede de segurança mobile: nada arrasta pro lado na vertical */
@media(max-width:768px){
  html,body{overflow-x:hidden !important;overflow-x:clip !important;max-width:100vw}
  .brand-page,.section,.section-body,.site-footer,.footer{max-width:100vw;overflow-x:hidden;overflow-x:clip}
  .section-body img,.section-body video,.site-footer img,.footer img{max-width:100%}
}
.section-band img,.band-video{max-width:100%}
.section-band::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 72%,var(--bg))}
/* TABLET HORIZONTAL (touch, >1024px): cards de marca empilham em grade centralizada (sem carrossel lateral) */
@media(min-width:1025px) and (pointer:coarse){
  .mw-cardrow,.brand-carousel,.bc-track,.mw-list{flex-wrap:wrap !important;overflow-x:visible !important;overflow:visible !important;width:auto !important;justify-content:center;gap:14px}
  .mw-card{flex:0 0 auto !important;width:180px !important;max-width:180px;scroll-snap-align:none}
  #cat-exhausts .fz-brandcard{flex:0 0 auto !important;width:180px !important}
}
/* ===== PROJECTS ===== */
#projects .prj-hero{position:relative;min-height:320px;display:flex;align-items:center;padding:56px clamp(16px,5vw,60px);background:linear-gradient(rgba(8,8,10,.6),rgba(8,8,10,.6)),url('/assets/garage_bg.jpg?v=2') center/cover,#0a0b0d;overflow:hidden}
#projects .prj-hero-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
/* na página Projetos, esconde o rodapé do site (Performance/Turbos/etc), é uma página só de projetos */
body:has(#projects.solo-active) .site-footer,body:has(#projects.solo-active) .footer{display:none !important}
.prj-clearf{background:var(--red,#D21F1F);color:#fff;border:none;border-radius:9px;padding:12px 16px;font-family:'Oswald',sans-serif;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap}
.prj-clearf:hover{filter:brightness(1.1)}
#projects .prj-hero-ov{position:absolute;inset:0;background:linear-gradient(115deg,rgba(8,8,10,.9),rgba(8,8,10,.35))}
#projects .prj-hero-in{position:relative;max-width:760px;z-index:1;text-align:center;margin:0 auto;display:flex;flex-direction:column;align-items:center}
#projects .prj-hero h1{font-family:'Racing Sans One',sans-serif;font-size:clamp(30px,6vw,54px);color:#fff;margin:4px 0 14px;line-height:1.05;letter-spacing:1px}
#projects .prj-hero p{color:#c9cdd4;font-size:15px;line-height:1.65;max-width:660px}
.prj-add-btn{margin-top:22px;background:var(--yellow,#F2C230);color:#111;border:none;padding:13px 24px;border-radius:8px;font-family:'Oswald',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.5px;font-size:14px;cursor:pointer;transition:.2s}
.prj-add-btn:hover{transform:translateY(-2px);box-shadow:0 8px 22px -6px rgba(242,194,48,.6)}
.prj-filter{display:flex;gap:12px;margin:26px 0 22px;flex-wrap:wrap}
.prj-search{flex:1;min-width:200px;background:#141519;border:1px solid #2a2e36;border-radius:9px;padding:12px 15px;color:#fff;font-family:inherit;font-size:14px;box-sizing:border-box}
.prj-search:focus{border-color:var(--yellow,#F2C230);outline:none}
.prj-brandsel{background:#141519;border:1px solid #2a2e36;border-radius:9px;padding:12px 15px;color:#fff;font-family:inherit;font-size:14px;min-width:170px;cursor:pointer}
.prj-grid{display:flex;flex-direction:column;gap:14px;margin-bottom:40px}
.prj-card{display:grid;grid-template-columns:190px 1fr auto;align-items:stretch;background:linear-gradient(135deg,#111318,#0b0c0f);border:1px solid #23262d;border-radius:14px;overflow:hidden;transition:.2s;position:relative;cursor:pointer}
.prj-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(#F2C230,#d99e10);opacity:0;transition:.2s;z-index:2}
.prj-card:hover{border-color:rgba(242,194,48,.5);box-shadow:0 16px 40px -20px rgba(0,0,0,.9);transform:translateY(-2px)}
.prj-card:hover::before{opacity:1}
.prj-card.pend{opacity:.85;border-style:dashed}
.prj-img{position:relative;background:#000;overflow:hidden}
.prj-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease;min-height:118px}
.prj-card:hover .prj-img img{transform:scale(1.06)}
.prj-img-ov{position:absolute;inset:0;background:linear-gradient(90deg,transparent 60%,rgba(11,12,15,.55) 100%);pointer-events:none}
.prj-noimg{width:100%;height:100%;min-height:118px;display:flex;align-items:center;justify-content:center;color:#3a3f48;font-size:34px}
.prj-noimg svg{width:44px;height:44px}
.prj-badge{position:absolute;top:10px;z-index:3;font-family:'Oswald',sans-serif;font-weight:700;font-size:9.5px;letter-spacing:1.3px;text-transform:uppercase;padding:4px 9px;border-radius:6px;backdrop-filter:blur(4px)}
.prj-badge.brand{right:10px;background:rgba(0,0,0,.6);color:var(--yellow,#F2C230);border:1px solid rgba(242,194,48,.55)}
.prj-badge.pend{left:10px;background:#d99e10;color:#111}
.prj-badge.ex{left:10px;background:rgba(56,164,255,.9);color:#fff}
.prj-info{padding:14px 16px;display:flex;flex-direction:column;justify-content:center;gap:6px;text-align:left;min-width:0}
.prj-eyebrow{font-family:'Oswald',sans-serif;font-size:10.5px;font-weight:600;letter-spacing:1.8px;text-transform:uppercase;color:var(--yellow,#F2C230)}
.prj-info h3{font-family:'Racing Sans One',sans-serif;font-size:19px;color:#fff;margin:0;line-height:1.12;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.prj-meta-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:2px}
.prj-hp-chip{display:inline-flex;align-items:baseline;gap:4px;background:rgba(242,194,48,.1);border:1px solid rgba(242,194,48,.3);border-radius:8px;padding:3px 10px;font-family:'Oswald',sans-serif;font-size:11px;letter-spacing:1px;color:#c9cdd4}
.prj-hp-chip b{font-family:'Racing Sans One',sans-serif;font-size:16px;color:var(--yellow,#F2C230)}
.prj-by{font-size:11.5px;color:#7f8794}
.prj-go{display:flex;align-items:center;gap:6px;padding:0 18px;font-family:'Oswald',sans-serif;font-size:11px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:#7f8794;background:rgba(255,255,255,.02);border-left:1px solid #1c1f26;transition:.2s;white-space:nowrap}
.prj-go svg{width:16px;height:16px;transition:transform .2s}
.prj-card:hover .prj-go{color:var(--yellow,#F2C230)}
.prj-card:hover .prj-go svg{transform:translateX(3px)}
.prj-empty{text-align:center;color:#7f8794;padding:50px 20px;font-size:15px}
.prj-specs{display:flex;gap:10px;margin:2px 0}
.prj-spec{display:flex;flex-direction:column;background:rgba(242,194,48,.07);border:1px solid rgba(242,194,48,.25);border-radius:10px;padding:9px 16px 8px;min-width:96px}
.prj-spec b{font-family:'Racing Sans One',sans-serif;font-size:30px;color:var(--yellow,#F2C230);line-height:1}
.prj-spec span{font-size:9.5px;color:#9aa0aa;letter-spacing:1.5px;font-weight:600;margin-top:3px}
.prj-desc{color:#c3c7cf;font-size:14px;line-height:1.6;margin:2px 0}
.prj-links{display:flex;gap:10px;flex-wrap:wrap;margin-top:4px}
.prj-lnk{display:inline-flex;align-items:center;gap:6px;font-size:13px;padding:7px 13px;border-radius:20px;text-decoration:none;font-weight:600;transition:.2s}
.prj-lnk svg{width:16px;height:16px}
.prj-lnk.ig{background:linear-gradient(135deg,#f09433,#e6683c,#dc2743,#cc2366);color:#fff}
.prj-lnk.yt{background:#ff0000;color:#fff}
.prj-lnk:hover{transform:translateY(-1px);opacity:.92}
.prj-owner{font-size:12px;color:#7f8794;margin-top:auto;padding-top:12px;border-top:1px solid #1e2128;display:flex;align-items:center;gap:8px}
.prj-owner b{color:#c3c7cf}
.prj-owner-dot{width:24px;height:24px;flex:none;border-radius:50%;background:linear-gradient(135deg,#F2C230,#d99e10);color:#111;font-family:'Oswald',sans-serif;font-weight:700;font-size:12px;display:flex;align-items:center;justify-content:center}
/* modal de detalhe do projeto (abre ao clicar no card) */
.prj-detail-ov{position:fixed;inset:0;z-index:10130;background:rgba(0,0,0,.82);backdrop-filter:blur(5px);display:none;align-items:center;justify-content:center;padding:20px 14px;overflow-y:auto}
.prj-detail-ov.on{display:flex;animation:prjFade .2s ease}
@keyframes prjFade{from{opacity:0}to{opacity:1}}
.prj-detail{width:100%;max-width:600px;background:linear-gradient(135deg,#111318,#0b0c0f);border:1px solid #2a2e36;border-top:3px solid var(--yellow,#F2C230);border-radius:16px;overflow:hidden;position:relative;box-shadow:0 30px 80px -30px #000;margin:auto;animation:prjPop .25s cubic-bezier(.2,.8,.2,1)}
@keyframes prjPop{from{transform:translateY(16px) scale(.98);opacity:.6}to{transform:none;opacity:1}}
.prj-detail-x{position:absolute;top:12px;right:12px;z-index:4;width:36px;height:36px;border-radius:50%;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.25);color:#fff;font-size:15px;cursor:pointer;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(4px);transition:.2s}
.prj-detail-x:hover{background:var(--red,#D21F1F);border-color:var(--red,#D21F1F)}
.prj-detail-img{position:relative;width:100%;height:260px;background:#000;overflow:hidden}
.prj-detail-img img{width:100%;height:100%;object-fit:cover;display:block}
.prj-detail-body{padding:22px 24px 26px;display:flex;flex-direction:column;gap:12px;text-align:center;align-items:center}
.prj-detail-body .prj-specs,.prj-detail-body .prj-links,.prj-detail-body .prj-owner{justify-content:center}
.prj-detail-body .prj-owner{margin-top:4px}
@media(max-width:600px){.prj-detail-img{height:200px}.prj-detail-body{padding:18px 18px 22px}}
@media(max-width:760px){
  .prj-card{grid-template-columns:104px 1fr}
  .prj-go{display:none}
  .prj-info{padding:11px 13px;gap:5px}
  .prj-info h3{font-size:16px}
  .prj-img img,.prj-noimg{min-height:104px}
}
/* form do cliente */
.prj-form-ov{position:fixed;inset:0;z-index:10120;background:rgba(0,0,0,.78);backdrop-filter:blur(4px);display:none;align-items:flex-start;justify-content:center;padding:24px 14px;overflow-y:auto}
.prj-form-ov.on{display:flex}
.prj-form{width:100%;max-width:480px;background:#0e0f12;border:1px solid #23262d;border-top:3px solid var(--yellow,#F2C230);border-radius:16px;padding:24px 22px;position:relative;box-sizing:border-box}
.prj-form *{box-sizing:border-box}
.prj-form-x{position:absolute;top:12px;right:14px;background:none;border:none;color:#9aa0aa;font-size:26px;cursor:pointer;line-height:1}
.prj-form h3{font-family:'Racing Sans One',sans-serif;color:#fff;margin:0 0 16px;font-size:21px}
.prj-form label{display:block;color:#c3c7cf;font-size:12.5px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin:14px 0 6px}
.prj-form input[type=text],.prj-form input:not([type]),.prj-form input[type=number],.prj-form textarea{width:100%;background:#16181d;border:1px solid #2a2e36;border-radius:8px;padding:11px 13px;color:#fff;font-family:inherit;font-size:14px}
.prj-form input:focus,.prj-form textarea:focus{border-color:var(--yellow,#F2C230);outline:none}
.prj-up{position:relative;width:100%;aspect-ratio:16/9;background:#16181d;border:1.5px dashed #2a2e36;border-radius:10px;overflow:hidden;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#7f8794;font-size:13px}
.prj-up img{width:100%;height:100%;object-fit:cover}
.prj-up input{position:absolute;inset:0;opacity:0;cursor:pointer}
.prj-row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.prj-social{display:flex;gap:10px;align-items:center;margin-top:12px}
.prj-social .prj-chk{display:flex;align-items:center;gap:7px;color:#c3c7cf;font-size:13px;white-space:nowrap;margin:0;text-transform:none;letter-spacing:0;font-weight:500}
.prj-social .prj-chk input{width:16px;height:16px}
.prj-social>input{flex:1;margin-top:0}
.prj-note{color:#8a9099;font-size:12px;margin:14px 0 0;line-height:1.5}
.prj-save{width:100%;margin-top:16px;background:var(--yellow,#F2C230);color:#111;border:none;padding:14px;border-radius:9px;font-family:'Oswald',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.5px;font-size:15px;cursor:pointer}
.prj-save:hover{filter:brightness(1.05)}
/* admin projetos */
.pja-row{display:flex;align-items:center;gap:12px;padding:10px;background:#141519;border:1px solid #23262d;border-radius:10px;margin-bottom:8px}
.pja-thumb{width:56px;height:44px;flex:none;border-radius:6px;overflow:hidden;background:#000;display:flex;align-items:center;justify-content:center}
.pja-thumb img{width:100%;height:100%;object-fit:cover}
.pja-info{flex:1;min-width:0;display:flex;flex-direction:column}
.pja-info b{color:#fff;font-size:14px}.pja-info span{color:#9aa0aa;font-size:12px}
.pja-acts{display:flex;gap:6px;flex-wrap:wrap}
.pja-acts button{border:none;border-radius:6px;padding:7px 11px;font-size:12px;font-weight:700;cursor:pointer;font-family:'Oswald',sans-serif}
.pja-ok{background:#2ec77a;color:#04220f}.pja-hide{background:#3a3f48;color:#fff}.pja-del{background:var(--red,#D21F1F);color:#fff}
.pja-edit{background:#F2C230;color:#111}.pja-acts{margin-left:auto}.pja-row{flex-wrap:wrap}
.pja-add{display:inline-flex;align-items:center;gap:8px;margin:4px 0 16px;background:var(--yellow,#F2C230);color:#111;border:0;border-radius:9px;padding:11px 20px;font-family:'Oswald',sans-serif;font-weight:700;font-size:14px;letter-spacing:.6px;text-transform:uppercase;cursor:pointer;box-shadow:0 6px 18px -8px rgba(242,194,48,.6);transition:filter .15s,transform .15s}
.pja-add:hover{filter:brightness(1.07);transform:translateY(-1px)}.pja-add svg{width:16px;height:16px}
.pja-warn{border:1px solid rgba(242,194,48,.45);background:rgba(242,194,48,.08);color:#f5e3a6;border-radius:10px;padding:10px 12px;font-size:13px;margin:0 0 12px}
.pja-lbl{color:#9aa0aa;font-size:12px;text-transform:uppercase;letter-spacing:1px;margin:14px 0 8px;font-weight:600}
.section-band img{width:100%;height:100%;object-fit:fill;display:block}
.band-video{width:100%;height:100%;object-fit:fill;display:block}
.mw-ico img{width:100%;height:100%;object-fit:contain;display:block}
.story-banner{width:100%;aspect-ratio:2172/724;border-radius:8px;overflow:hidden;margin:0 0 40px;border:1px solid var(--line)}
.story-banner img{width:100%;height:100%;object-fit:cover;display:block}
/* corta a linha branca do topo do vídeo: leve zoom + deslocamento pra cima */
.story-banner video{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.035) translateY(-1.5%);transform-origin:center}

/* PÁGINA DE MARCA */
.brand-page{display:none;min-height:100vh;padding:80px clamp(24px,6vw,80px) 90px;position:relative}
body.brand-open .section{display:none !important}
body.brand-open .menu-screen{display:none !important}
.brand-page.active{display:block}
.brand-hero{max-width:760px;margin:0 auto;border-radius:12px;overflow:hidden;border:1px solid var(--line);box-shadow:0 20px 60px -20px rgba(0,0,0,.8)}
.brand-hero img{width:100%;height:auto;display:block}
.brand-cta{display:inline-block;padding:15px 40px;background:var(--red);color:#fff;font-family:'Oswald';font-weight:600;font-style:italic;text-transform:uppercase;letter-spacing:1.5px;border-radius:6px;transition:.2s}
.brand-cta:hover{background:#b01818;transform:translateY(-2px)}
/* título clicável de categoria */
.cat-link{cursor:pointer;transition:.2s;display:block;text-align:center}
.cat-link:hover{color:var(--red);text-shadow:0 0 20px rgba(210,31,31,.5)}
.cat-arrow{color:var(--yellow);font-size:.7em;transition:.2s;display:inline-block}
.cat-link:hover .cat-arrow{transform:translateX(6px)}
/* intro de categoria */
.cat-intro{max-width:820px;margin:30px auto 10px}
.cat-origin{max-width:900px;margin:18px auto 6px;background:linear-gradient(135deg,rgba(242,194,48,.08),rgba(210,31,31,.06));border:1px solid rgba(242,194,48,.3);border-radius:12px;padding:14px 20px;display:flex;gap:14px;align-items:flex-start;font-family:'Oswald',sans-serif}
.cat-origin .co-flag{font-size:26px;flex:none;line-height:1.2}
.cat-origin .co-tx{color:#d7dae0;font-size:13.5px;line-height:1.55}
.cat-origin .co-tx b{color:var(--yellow)}
.cat-origin .co-tx .co-ship{color:#9aa0aa;font-size:12px;display:block;margin-top:4px}
.cat-intro p{color:#cfcfcf;font-size:16px;line-height:1.75;margin-bottom:16px}
.cat-intro strong{color:#fff;font-weight:600}
.cat-brands-title{text-align:center;font-family:'Racing Sans One',cursive;font-size:20px;color:var(--yellow);text-transform:uppercase;margin:36px 0 18px;letter-spacing:1px}

/* FILTRO DE PRODUTOS */
.prod-filter{max-width:1000px;margin:50px auto 0;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:12px;padding:28px;position:relative;overflow:hidden}
.prod-filter > *{position:relative;z-index:1}
/* ===== Filtros: fundo estúdio 3D (mesma luz das fotos de produto), aplicado em TODOS ===== */
.prod-filter{background:#08080a url('/assets/studio_bg.jpg') center/cover no-repeat;
  border:1px solid rgba(242,194,48,.38);
  box-shadow:0 30px 80px -30px rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.05), inset 0 0 120px rgba(0,0,0,.55)}
.prod-filter::before{content:none}
.prod-filter::after{content:"";position:absolute;inset:0;z-index:0;
  background:radial-gradient(120% 90% at 50% 32%, rgba(255,255,255,0), rgba(6,6,8,.55) 78%)}
/* campos com superfície elevada + borda clara = contraste forte */
.filter-search input,
.filter-field select,
.filter-field input{
  background:linear-gradient(180deg,#212124,#171719);
  border:1px solid rgba(255,255,255,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07), 0 3px 8px rgba(0,0,0,.45);color:#fff}
.filter-search input::placeholder,
.filter-field input::placeholder{color:#8f8f8f}
.filter-search input:focus,
.filter-field select:focus,
.filter-field input:focus{border-color:var(--yellow);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07), 0 0 0 3px rgba(242,194,48,.20)}
.filter-field label{color:#d2d2d2}
.prod-filter h3{text-shadow:0 2px 14px rgba(0,0,0,.8)}
.filter-btn.clear{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.30);color:#fff}
.filter-btn.clear:hover{border-color:var(--yellow);color:var(--yellow);background:rgba(242,194,48,.10)}
.filter-count{background:rgba(0,0,0,.5);border-color:rgba(242,194,48,.5)}
/* banner de vídeo intermediário (entre marquee e grade de marcas) */
.veh-midband{position:relative;max-width:1240px;margin:26px auto 6px;border-radius:14px;overflow:hidden;
  aspect-ratio:1920/300;border:1px solid rgba(255,255,255,.06);box-shadow:0 24px 60px -30px rgba(0,0,0,.9);line-height:0}
.veh-midband video{width:100%;height:100%;object-fit:cover;display:block}
.veh-midband::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,10,10,.55),rgba(10,10,10,0) 25%,rgba(10,10,10,0) 75%,rgba(10,10,10,.55))}
/* banner de capas giratório (troca de 3 em 3s, crossfade), contido */
.capa-banner{position:relative;max-width:1240px;margin:24px auto 6px;border-radius:14px;overflow:hidden;aspect-ratio:1920/400;
  border:1px solid rgba(255,255,255,.06);box-shadow:0 24px 60px -30px rgba(0,0,0,.9);background:#0a0a0a}
.capa-banner img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1s ease}
.capa-banner img.on{opacity:1}
.capa-banner::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(10,10,10,.15),rgba(10,10,10,0) 30%,rgba(10,10,10,0) 70%,rgba(10,10,10,.35))}
/* capa full-bleed no topo (igual .section-band) */
.section-band.capa-band img{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;opacity:0;transition:opacity 1s ease}
.section-band.capa-band img.on{opacity:1}
.section-band.capa-band .capa-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
/* ===== LOGIN / CONTA ===== */
.acct-icon-wrap{position:relative;display:flex;align-items:center}
.acct-caret{background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.14);border-radius:10px;width:30px;height:44px;margin-left:4px;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.15s}
.acct-caret:hover{border-color:var(--yellow);color:var(--yellow)}
.acct-switcher{position:absolute;top:calc(100% + 8px);right:0;width:290px;background:#101013;border:1px solid rgba(255,255,255,.14);border-radius:14px;box-shadow:0 20px 50px -12px rgba(0,0,0,.8);padding:8px;z-index:10060;display:none}
.acct-switcher.on{display:block}
.acsw-row{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:10px;cursor:pointer;transition:.12s}
.acsw-row:hover{background:rgba(255,255,255,.06)}
.acsw-row.on{background:rgba(242,194,48,.1)}
.acsw-av{flex:none;width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,#D21F1F,#8f1414);color:#fff;display:flex;align-items:center;justify-content:center;font-family:'Oswald',sans-serif;font-weight:600;font-size:13px;overflow:hidden}
.acsw-av img{width:100%;height:100%;object-fit:cover}
.acsw-info{flex:1;min-width:0;display:flex;flex-direction:column}
.acsw-info b{color:#fff;font-size:13.5px;font-family:'Oswald',sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.acsw-info small{color:#9aa0aa;font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.acsw-check{color:var(--yellow);font-size:16px;flex:none}
.acsw-x{color:#7a7f88;font-size:18px;flex:none;padding:0 4px;border-radius:6px}
.acsw-x:hover{color:#ff8a8a;background:rgba(210,31,31,.15)}
.acsw-empty{color:#8a8f98;text-align:center;padding:14px;font-size:13px}
.acsw-actions{border-top:1px solid rgba(255,255,255,.1);margin-top:6px;padding-top:6px;display:flex;flex-direction:column;gap:2px}
.acsw-actions button{background:none;border:none;color:#dfe2e7;text-align:left;padding:9px 10px;border-radius:8px;cursor:pointer;font-family:'Oswald',sans-serif;font-size:13px}
.acsw-actions button:hover{background:rgba(255,255,255,.06);color:var(--yellow)}
.acsw-actions .acsw-out:hover{color:#ff8a8a}
/* score / velocímetro do cliente, premium */
.score-card{position:relative;overflow:hidden;background:linear-gradient(145deg,rgba(20,20,24,.9),rgba(10,10,12,.95))!important;border:1px solid rgba(255,255,255,.1)!important}
.score-card::before{content:'';position:absolute;top:-40%;right:-10%;width:300px;height:300px;background:radial-gradient(circle,rgba(242,194,48,.08),transparent 70%);pointer-events:none}
.score-card .sc-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;position:relative}
.score-card .sc-badge{font-family:'Racing Sans One',cursive;color:#111;font-size:13px;padding:5px 16px;border-radius:20px;box-shadow:0 6px 18px -6px rgba(0,0,0,.6)}
.score-card .sc-body{display:flex;gap:24px;align-items:center;flex-wrap:wrap;position:relative}
.score-card .sc-gauge{flex:none;filter:drop-shadow(0 10px 30px rgba(0,0,0,.5))}
.score-card .sc-side{flex:1;min-width:220px}
.score-card .sc-level{font-family:'Racing Sans One',cursive;font-size:28px;margin-bottom:4px;text-shadow:0 2px 10px rgba(0,0,0,.5)}
.score-card .sc-next{color:#c3c7cf;font-size:13.5px;margin-bottom:10px}
.score-card .sc-bar{height:10px;background:rgba(255,255,255,.06);border-radius:5px;overflow:hidden;margin-bottom:14px;box-shadow:inset 0 1px 3px rgba(0,0,0,.4)}
.score-card .sc-bar i{display:block;height:100%;border-radius:5px;transition:width .6s cubic-bezier(.3,.9,.3,1);box-shadow:0 0 12px currentColor}
.score-card .sc-benes{display:flex;flex-direction:column;gap:8px}
.score-card .sc-bene{display:flex;align-items:center;gap:9px;font-size:13.5px;color:#eef;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);border-radius:10px;padding:8px 12px}
.score-card .sc-bene span{font-size:16px}
.score-card .sc-ladder{display:flex;gap:10px;margin-top:20px;flex-wrap:wrap;position:relative}
.score-card .sc-rung{flex:1;min-width:100px;background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:12px;padding:12px 10px;text-align:center;opacity:.5;transition:.25s;position:relative}
.score-card .sc-rung.on{opacity:1;border-color:var(--c);background:linear-gradient(180deg,color-mix(in srgb,var(--c) 18%,transparent),transparent);box-shadow:0 10px 30px -12px var(--c),inset 0 0 20px -12px var(--c);transform:translateY(-3px)}
.score-card .sc-rung .sc-dot{display:block;width:12px;height:12px;border-radius:50%;background:var(--c);margin:0 auto 6px;box-shadow:0 0 10px var(--c)}
.score-card .sc-rung b{display:block;color:#fff;font-family:'Oswald',sans-serif;font-size:13.5px;letter-spacing:.5px}
.score-card .sc-rung small{color:#9aa0aa;font-size:11px}
.score-card .sc-rung.on small{color:var(--c)}
.score-card .sc-earn{margin-top:16px;font-size:12px;color:#9aa0aa;line-height:1.7;background:rgba(255,255,255,.02);border-radius:12px;padding:14px 16px;border:1px solid rgba(255,255,255,.05)}
@media(max-width:640px){.score-card .sc-body{justify-content:center}}
/* admin rewards */
#rewards-panel .rw-levels{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-top:12px}
#rewards-panel .rw-lvl{background:rgba(255,255,255,.02);border:1px solid var(--c);border-radius:12px;padding:14px}
#rewards-panel .rw-lvl-h{display:flex;align-items:center;gap:8px;margin-bottom:8px}
#rewards-panel .rw-dot{width:12px;height:12px;border-radius:50%;background:var(--c);flex:none}
#rewards-panel .rw-name{font-family:'Racing Sans One',cursive!important;color:#fff!important;font-size:15px!important}
#rewards-panel .rw-lbl{display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.5px;color:#9aa0aa;margin:8px 0 3px}
#rewards-panel .rw-in{width:100%;background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:8px;color:#fff;font-family:'Oswald',sans-serif;font-size:13px;padding:8px 10px}
#rewards-panel .rw-in:focus{outline:none;border-color:var(--yellow)}
#rewards-panel .rw-chk{display:flex;align-items:center;gap:7px;color:#c3c7cf;font-size:12.5px;margin:10px 0;cursor:pointer}
#rewards-panel .rw-pts-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin-top:8px}
#rewards-panel .rw-pt label{display:block;font-size:12px;color:#c3c7cf;margin-bottom:4px}
#rewards-panel .rw-pt input{width:100%;background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:8px;color:#fff;font-family:'Oswald',sans-serif;font-size:13px;padding:8px 10px}
#rewards-panel .rw-decay{margin-top:14px}
.adm-bulk{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:10px 0;padding:10px 12px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:10px}
.dr-brandfilter{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.dr-brandfilter input{flex:1;background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#fff;font-family:'Oswald',sans-serif;font-size:14px;padding:10px 14px}
.dr-brandfilter input:focus{outline:none;border-color:var(--yellow)}
/* members & scores (admin) */
#ap-members .mb-summary{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
#ap-members .mb-controls{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:12px}
#ap-members .mb-searchbox{flex:1;min-width:220px;background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#fff;font-family:'Oswald',sans-serif;font-size:14px;padding:11px 14px}
#ap-members .mb-searchbox:focus{outline:none;border-color:var(--yellow)}
#ap-members .mb-levelpills{display:flex;gap:8px;flex-wrap:wrap}
#ap-members .mb-pill{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.04);border:1.5px solid rgba(255,255,255,.12);border-radius:20px;padding:8px 16px;font-family:'Oswald',sans-serif;font-weight:600;font-size:13px;color:#c3c7cf;cursor:pointer;transition:.15s}
#ap-members .mb-pill:hover{border-color:var(--pc);color:#fff}
#ap-members .mb-pill.on{background:var(--pc);border-color:var(--pc);color:#111}
#ap-members .mb-pill .mb-pill-dot{width:9px;height:9px;border-radius:50%;background:var(--pc);box-shadow:0 0 6px var(--pc)}
#ap-members .mb-pill.on .mb-pill-dot{background:#111;box-shadow:none}
#ap-members .mb-sumcard{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.03);border:1px solid var(--c);border-radius:10px;padding:8px 14px}
#ap-members .mb-sumdot{width:10px;height:10px;border-radius:50%;background:var(--c);box-shadow:0 0 8px var(--c)}
#ap-members .mb-sumcard b{font-family:'Racing Sans One',cursive;color:#fff;font-size:18px}
#ap-members .mb-sumcard span{color:#9aa0aa;font-size:12px}
#ap-members .mb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;margin-top:14px}
#ap-members .mb-card{background:linear-gradient(160deg,rgba(255,255,255,.03),rgba(0,0,0,.2));border:1px solid var(--c);border-radius:16px;padding:16px;text-align:center;position:relative;overflow:hidden;transition:.2s}
#ap-members .mb-card:hover{transform:translateY(-3px);box-shadow:0 16px 40px -14px var(--c)}
#ap-members .mb-card::before{content:'';position:absolute;top:-30%;left:-20%;width:160px;height:160px;background:radial-gradient(circle,color-mix(in srgb,var(--c) 22%,transparent),transparent 70%);pointer-events:none}
#ap-members .mb-card-top{display:flex;justify-content:space-between;align-items:center;position:relative}
#ap-members .mb-rank{font-family:'Racing Sans One',cursive;color:#9aa0aa;font-size:15px}
#ap-members .mb-lvlbadge{font-family:'Racing Sans One',cursive;color:#111;font-size:11px;padding:3px 10px;border-radius:12px}
#ap-members .mb-gauge{margin:4px 0}
#ap-members .mb-who{display:flex;align-items:center;gap:9px;justify-content:center;margin-bottom:8px}
#ap-members .mb-av{width:32px;height:32px;border-radius:50%;background:var(--c);color:#111;display:flex;align-items:center;justify-content:center;font-family:'Oswald',sans-serif;font-weight:700;font-size:13px;flex:none;overflow:hidden}
#ap-members .mb-av img{width:100%;height:100%;object-fit:cover}
#ap-members .mb-info{text-align:left;min-width:0}
#ap-members .mb-info b{display:block;color:#fff;font-family:'Oswald',sans-serif;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:130px}
#ap-members .mb-info small{color:#9aa0aa;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block;max-width:130px}
#ap-members .mb-next{font-size:12px;color:#c3c7cf}
#ap-members .mb-quiet{margin-top:6px;font-size:11px;color:#ff8a8a;background:rgba(210,31,31,.12);border-radius:8px;padding:4px 8px}
#ap-members .mb-active{margin-top:6px;font-size:11px;color:#7fe0aa}
@media(max-width:640px){.score-card .sc-body{justify-content:center}}
.acct-icon-btn{display:flex;align-items:center;gap:9px;padding:10px 16px;background:rgba(0,0,0,.75);border:1px solid var(--line);border-radius:10px;color:#fff;font-family:'Oswald';font-weight:600;letter-spacing:.5px;text-transform:uppercase;font-size:13px;cursor:pointer;transition:.18s}
.acct-icon-btn:hover{border-color:var(--yellow);color:var(--yellow)}
.acct-icon-btn svg{width:20px;height:20px}
.acct-avatar{width:22px;height:22px;border-radius:50%;object-fit:cover;border:1px solid var(--yellow)}
/* modal */
.auth-ov{position:fixed;inset:0;z-index:10050;background:rgba(0,0,0,.78);backdrop-filter:blur(4px);display:none;align-items:center;justify-content:center;padding:20px}
.auth-ov.on{display:flex}
.auth-modal{width:100%;max-width:420px;background:#0c0c0d url('/assets/studio_bg.jpg') center/cover;border:1px solid rgba(242,194,48,.4);border-radius:16px;overflow:hidden;box-shadow:0 40px 100px -30px #000;position:relative}
.auth-modal::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 90% at 50% 20%,rgba(255,255,255,0),rgba(6,6,8,.6));pointer-events:none}
.auth-inner{position:relative;z-index:1;padding:30px 28px 26px}
.intro-skip{display:none !important}
#rankadm-ov .auth-modal,#invgen-ov .auth-modal,#aff-ov .auth-modal,#margin-ov .auth-modal,#export-ov .auth-modal,#help-ov .auth-modal{max-height:92vh}
#rankadm-ov .auth-inner,#invgen-ov .auth-inner,#aff-ov .auth-inner,#margin-ov .auth-inner,#export-ov .auth-inner,#help-ov .auth-inner{max-height:92vh;overflow-y:auto}
#rankadm-ov .auth-x,#invgen-ov .auth-x,#aff-ov .auth-x,#margin-ov .auth-x,#export-ov .auth-x,#help-ov .auth-x{position:absolute;top:12px;right:14px;z-index:5;background:var(--red);border-radius:8px;width:34px;height:34px;line-height:1;color:#fff}
/* ===== celular DEITADO (pouca altura): titulos e header proporcionais ===== */
@media (orientation:landscape) and (max-height:540px){
  .sec-title{ font-size:clamp(24px,5.2vh,34px) !important; }
  .eyebrow{ font-size:10.5px !important; letter-spacing:1.4px !important; }
  .sec-count{ font-size:12.5px !important; }
  .hdr-actions{ top:10px !important; right:10px !important; gap:8px !important; }
  .acct-icon-btn,.cart-icon-btn{ padding:6px 9px !important; font-size:11px !important; gap:6px !important; }
  .back-btn,.mainmenu-btn{ padding:6px 10px !important; font-size:11px !important; }
  #blplang .lg-btn{ padding:4px 8px !important; font-size:11px !important; }
  .brand-page,.section{ padding-top:62px !important; }
  .bl-word{ font-size:clamp(30px,9vh,52px) !important; }
}
/* ===== Blacklist no celular em pe: um pouco menor ===== */
@media (max-width:560px){
  #cat-blacklist .sec-title{ font-size:clamp(26px,8vw,38px) !important; }
  #cat-blacklist .eyebrow{ font-size:10.5px !important; }
  #cat-blacklist .sec-count{ font-size:12.5px !important; }
}
#dyno-return-bar{position:fixed;left:50%;transform:translateX(-50%);bottom:-80px;z-index:9000;background:linear-gradient(135deg,#D21F1F,#a81818);color:#fff;border-radius:14px;padding:12px 24px;display:flex;flex-direction:column;align-items:center;cursor:pointer;box-shadow:0 14px 40px -10px rgba(210,31,31,.7);transition:bottom .35s cubic-bezier(.2,.9,.3,1);font-family:'Oswald',sans-serif}
#blg-overlay{position:fixed;inset:0;z-index:11499;background:rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:.25s}
#blg-overlay.on{opacity:1;pointer-events:auto}
#blg-panel{position:fixed;top:0;right:-420px;width:400px;max-width:92vw;height:100%;z-index:11500;background:#0d0e11;border-left:1px solid rgba(242,194,48,.3);display:flex;flex-direction:column;transition:right .28s cubic-bezier(.2,.9,.3,1);box-shadow:-20px 0 60px -20px #000}
#blg-panel.on{right:0}
#blg-panel .blg-head{display:flex;align-items:center;gap:10px;padding:16px 18px;border-bottom:1px solid rgba(255,255,255,.08);background:linear-gradient(135deg,rgba(210,31,31,.15),rgba(242,194,48,.08))}
#blg-panel .blg-title{flex:1;color:#fff;font-family:'Racing Sans One',cursive;font-size:16px;letter-spacing:.5px}
#blg-panel .blg-back,#blg-panel .blg-x{background:none;border:none;color:#fff;font-size:22px;cursor:pointer;width:30px;height:30px}
#blg-panel .blg-x{background:var(--red);border-radius:7px;font-size:18px}
#blg-panel .blg-body{flex:1;overflow-y:auto;padding:12px}
#blg-panel .blg-create{background:rgba(46,199,122,.06);border:1px solid rgba(46,199,122,.3);border-radius:11px;padding:13px;margin-bottom:12px}
#blg-panel .blg-create-t{color:#7fe0a8;font-family:'Oswald';font-weight:600;font-size:14px}
#blg-panel .blg-crow{display:flex;gap:8px}
#blg-panel .blg-crow input,#blg-panel #blg-name{flex:1;background:#141416;border:1px solid rgba(255,255,255,.14);border-radius:8px;color:#fff;padding:9px 11px;font-family:'Oswald';font-size:13px}
#blg-panel .blg-crow button{background:#2ec77a;color:#062b18;border:none;border-radius:8px;padding:9px 15px;font-family:'Oswald';font-weight:600;cursor:pointer}
#blg-panel .blg-thread{display:flex;align-items:center;gap:12px;padding:11px 10px;border-radius:10px;cursor:pointer;transition:.12s}
#blg-panel .blg-newrow{display:flex;gap:8px;margin-bottom:12px}
#blg-panel .blg-newbtn{flex:1;background:rgba(46,199,122,.1);border:1px solid rgba(46,199,122,.35);color:#7fe0a8;border-radius:9px;padding:11px;font-family:'Oswald';font-weight:600;font-size:13px;cursor:pointer}
#blg-panel .blg-newbtn.grp{background:rgba(242,194,48,.1);border-color:rgba(242,194,48,.35);color:#f0d68a}
#blg-panel .blg-newbtn:hover{filter:brightness(1.15)}
#blg-panel .blg-sec{color:#7a7f88;font-size:10px;text-transform:uppercase;letter-spacing:1.5px;margin:12px 4px 4px;font-family:'Oswald'}
#blg-panel .blg-empty{color:#7a7f88;text-align:center;font-size:12.5px;padding:16px}
#blg-panel .blg-ava.grp{background:linear-gradient(135deg,#F2C230,#D21F1F)}
#blg-panel .blg-thread:hover{background:rgba(255,255,255,.05)}
#blg-panel .blg-ava{width:44px;height:44px;flex:none;border-radius:50%;background:linear-gradient(135deg,#D21F1F,#F2C230);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-family:'Oswald';font-size:18px}
#blg-panel .blg-tmeta{flex:1;min-width:0}
#blg-panel .blg-tname{color:#fff;font-family:'Oswald';font-size:14px}
#blg-panel .blg-tname span{color:#7a7f88;font-weight:400;font-size:12px}
#blg-panel .blg-tlast{color:#8a8f98;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#blg-panel .blg-del{background:none;border:none;color:#ff6b6b;font-size:18px;cursor:pointer;flex:none}
#blg-panel .blg-members{display:flex;flex-wrap:wrap;gap:6px;padding:8px 4px 12px;border-bottom:1px solid rgba(255,255,255,.07);margin-bottom:10px}
#blg-panel .blg-members span{background:rgba(242,194,48,.12);border:1px solid rgba(242,194,48,.3);color:#f0d68a;border-radius:20px;padding:3px 10px;font-size:11px;font-family:'Oswald'}
#blg-panel .blg-msgs{display:flex;flex-direction:column;gap:8px}
#blg-panel .blg-msg{display:flex}
#blg-panel .blg-msg.me{justify-content:flex-end}
#blg-panel .blg-b{max-width:78%;background:#1b1e24;border-radius:12px;padding:8px 12px;color:#e6e6e6;font-size:13.5px;position:relative}
#blg-panel .blg-msg.me .blg-b{background:linear-gradient(135deg,#2ec77a,#1fa363);color:#062b18}
#blg-panel .blg-from{display:block;color:var(--yellow);font-size:11px;font-weight:600;margin-bottom:2px}
#blg-panel .blg-msg.me .blg-from{color:#063}
#blg-panel .blg-time{display:block;font-size:9px;opacity:.6;text-align:right;margin-top:3px}
#blg-panel .blg-sys{text-align:center;color:#7a7f88;font-size:11px;font-style:italic;margin:4px 0}
#blg-panel .blg-foot{display:flex;gap:8px;padding:12px;border-top:1px solid rgba(255,255,255,.08)}
#blg-panel .blg-foot input{flex:1;background:#141416;border:1px solid rgba(255,255,255,.14);border-radius:20px;color:#fff;padding:10px 15px;font-family:'Oswald';font-size:13px}
#blg-panel .blg-foot button{background:var(--red);color:#fff;border:none;border-radius:20px;padding:10px 20px;font-family:'Oswald';font-weight:600;cursor:pointer}
#dyno-return-bar2{display:none}
#dyno-return-bar.show{bottom:24px;bottom:calc(24px + env(safe-area-inset-bottom,0px))}
@media(max-width:820px){
  #dyno-return-bar{left:12px !important;right:12px !important;transform:none !important;max-width:none;padding:10px 14px;text-align:center}
  #dyno-return-bar.show{bottom:calc(84px + env(safe-area-inset-bottom,0px))}
  #dyno-return-bar span{font-size:13px}
  #dyno-return-bar small{font-size:10px}
}
#dyno-return-bar span{font-weight:700;font-size:15px;letter-spacing:.5px}
#dyno-return-bar small{font-size:11px;opacity:.85;letter-spacing:.3px}
#dyno-return-bar:hover{filter:brightness(1.08)}
.auth-ov{overflow-y:auto}
/* modais (request escapamento etc.) usáveis no mobile: começam no topo e rolam, grids em 1 coluna */
@media(max-width:640px){
  .auth-ov{align-items:flex-start !important;padding:12px !important;-webkit-overflow-scrolling:touch}
  .auth-ov .age-card{max-width:100% !important;width:100% !important;margin:0 auto !important;padding:18px 16px !important}
  #exreq-ov .exreq-g2,#exreq-ov .exreq-g3{grid-template-columns:1fr !important}
  #exreq-ov .exreq-modal-h{font-size:18px}
  #exreq-ov .exreq-brandhead img{height:30px}
}
.auth-x{position:absolute;top:12px;right:14px;background:none;border:none;color:#999;font-size:24px;cursor:pointer;z-index:2}
.auth-x:hover{color:#fff}
.auth-logo{text-align:center;font-family:'Racing Sans One',cursive;font-size:22px;color:#fff;letter-spacing:1px;margin-bottom:2px}
.auth-logo b{color:var(--yellow)}
.auth-sub{text-align:center;color:var(--muted);font-size:12px;letter-spacing:1px;text-transform:uppercase;margin-bottom:20px}
.auth-tabs{display:flex;gap:0;margin-bottom:18px;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.auth-tab{flex:1;padding:11px;background:transparent;border:none;color:#cfcfcf;font-family:'Oswald';font-weight:600;text-transform:uppercase;letter-spacing:1px;font-size:13px;cursor:pointer;transition:.15s}
.auth-tab.on{background:var(--yellow);color:#111}
.auth-field{margin-bottom:13px}
.auth-field label{display:block;font-size:11px;letter-spacing:1px;text-transform:uppercase;color:#bdbdbd;margin-bottom:6px}
.auth-field input{width:100%;padding:12px 14px;background:linear-gradient(180deg,#1f1f22,#171719);border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#fff;font-family:'Oswald';font-size:15px}
.pass-wrap{position:relative}
.pass-wrap input{padding-right:44px!important}
.pass-eye{position:absolute;right:6px;top:50%;transform:translateY(-50%);background:transparent;border:none;cursor:pointer;font-size:17px;padding:6px 8px;line-height:1;opacity:.55;transition:.15s;border-radius:6px}
.pass-eye:hover{opacity:1}
.pass-eye.on{opacity:1;filter:drop-shadow(0 0 4px rgba(242,194,48,.6))}
.auth-field input:focus{outline:none;border-color:var(--yellow);box-shadow:0 0 0 3px rgba(242,194,48,.18)}
.auth-submit{width:100%;margin-top:6px;padding:14px;background:var(--red);border:none;border-radius:10px;color:#fff;font-family:'Racing Sans One',cursive;font-size:16px;letter-spacing:.5px;text-transform:uppercase;cursor:pointer;transition:.18s}
.auth-extras{display:flex;align-items:center;justify-content:space-between;margin:2px 0 4px;gap:10px}
.auth-remember{display:flex;align-items:center;gap:7px;font-size:13px;color:#c3c7cf;cursor:pointer;font-family:'Oswald',sans-serif}
.auth-remember input{width:15px;height:15px;accent-color:var(--gold,#F2C230);cursor:pointer}
.auth-forgot{background:none;border:none;color:var(--gold,#F2C230);font-size:13px;cursor:pointer;font-family:'Oswald',sans-serif;padding:0;text-decoration:underline;text-underline-offset:2px}
.auth-forgot:hover{filter:brightness(1.1)}
.caps-warn{color:#e6a417;font-size:12px;margin-top:6px;font-family:'Oswald',sans-serif}
.auth-submit:hover{background:#b81a1a;transform:translateY(-1px)}
.auth-msg{margin-top:12px;text-align:center;font-size:13px;min-height:16px}
.auth-msg.err{color:#ff6b6b}.auth-msg.ok{color:#2ec77a}
#rankadm-body .adm-card{background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.09);border-radius:14px;padding:22px 24px;margin-bottom:18px}
.msg-card{background:#141519;border:1px solid #23262d;border-radius:10px;padding:14px;margin-bottom:12px}
.msg-h{font-family:'Oswald',sans-serif;font-weight:600;color:#fff;font-size:14px;margin-bottom:8px}
.msg-h span{color:#7f8794;font-size:11px;font-weight:400}
.msg-card label{display:block;color:#9aa0aa;font-size:11px;text-transform:uppercase;letter-spacing:.5px;margin:8px 0 4px}
.msg-in{width:100%;background:#0d0e12;border:1px solid #2a2e36;border-radius:8px;color:#fff;padding:9px 11px;font-size:13px;font-family:'Oswald',sans-serif;box-sizing:border-box}
.msg-in:focus{border-color:var(--yellow);outline:none}
textarea.msg-in{resize:vertical;line-height:1.4}
#rankadm-body .bl-toggle{display:flex;gap:10px;justify-content:center;margin:4px 0 16px}
#cat-blacklist .bl-toggle{display:flex;gap:10px;justify-content:center;margin:6px auto 20px;flex-wrap:wrap}
#rankadm-body .bl-tg{cursor:pointer;font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:1.5px;font-size:13px;color:#d7dae0;padding:10px 26px;border:1px solid rgba(255,255,255,.18);border-radius:999px;background:rgba(255,255,255,.03);transition:.15s}
#rankadm-body .bl-tg:hover{border-color:var(--yellow);color:#fff}
#rankadm-body .bl-tg.on{background:var(--red);color:#fff;border-color:var(--red);font-weight:600}
#rankadm-body .adm-table input[type=checkbox]{width:18px;height:18px;cursor:pointer;accent-color:#D21F1F}
#rankadm-body .radm-chk-off{color:#4a4a4a}
#rankadm-body .radm-bulk{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:10px 0;padding:10px 12px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:10px}
#rankadm-body .adm-card h3{font-family:'Racing Sans One',sans-serif;color:var(--yellow);margin:0 0 4px;font-size:16px;display:flex;align-items:center;gap:8px}
#rankadm-body .hint{color:#9aa0aa;font-size:12.5px;margin-bottom:14px;line-height:1.5}
#rankadm-body .adm-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
#rankadm-body .adm-in{background:#141416;border:1px solid rgba(255,255,255,.16);border-radius:9px;color:#fff;padding:11px 13px;font-family:'Oswald',sans-serif;font-size:14px}
#rankadm-body .adm-in:focus{outline:none;border-color:var(--yellow)}
#rankadm-body .adm-table{width:100%;border-collapse:separate;border-spacing:0;font-size:13.5px}
#rankadm-body .adm-table th{text-align:left;padding:11px 12px;color:#9aa0aa;text-transform:uppercase;letter-spacing:1px;font-size:10px;font-family:'Oswald',sans-serif;border-bottom:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.02)}
#rankadm-body .adm-table td{padding:12px;border-bottom:1px solid rgba(255,255,255,.06);color:#dfe2e7;vertical-align:middle}
#rankadm-body .adm-table tbody tr:hover td{background:rgba(242,194,48,.04)}
#rankadm-body .adm-table .bl-rk{font-family:'Racing Sans One',sans-serif;color:var(--yellow);font-size:16px}
#rankadm-body .adm-table .bl-sp{font-family:'Racing Sans One',sans-serif;color:var(--red);font-size:15px;white-space:nowrap}
#rankadm-body .adm-table td:last-child{text-align:right;white-space:nowrap}
#rankadm-body .adm-table .adm-btn{margin:2px}
#rankadm-body .radm-actions{display:flex;gap:6px;justify-content:flex-end;flex-wrap:nowrap}
.adm-btn{background:var(--yellow);color:#111;border:none;border-radius:8px;padding:9px 15px;font-family:'Oswald',sans-serif;font-size:12px;letter-spacing:.6px;text-transform:uppercase;font-weight:600;cursor:pointer;transition:.12s}
.adm-btn:hover{filter:brightness(1.08)}
.adm-btn.red{background:var(--red);color:#fff}.adm-btn.ghost{background:transparent;border:1px solid rgba(255,255,255,.22);color:#ddd}
.adm-btn.green{background:#2ec77a;color:#062b18}
#rankadm-body .radm-section-t{font-family:'Oswald',sans-serif;font-size:11px;text-transform:uppercase;letter-spacing:2px;color:#7a7f88;margin:2px 0 12px}
#invgen-body .ig-row{display:flex;gap:8px;margin-bottom:8px;align-items:center}
#export-body .exp-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 20px;margin-top:6px}
#export-body h3{font-family:'Racing Sans One',cursive;color:var(--yellow);font-size:15px;margin:0 0 4px;letter-spacing:.5px}
#export-body .adm-card{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:12px;padding:18px 20px}
#export-body .ig-row{display:flex;gap:10px;flex-wrap:wrap}
#export-body .ig-in,#export-body select{background:#141416;border:1px solid rgba(255,255,255,.14);border-radius:9px;color:#fff;padding:11px 13px;font-family:'Oswald',sans-serif;font-size:14px;cursor:pointer;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23F2C230' d='M6 8 0 0h12z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 13px center;padding-right:34px}
#export-body .ig-in:focus,#export-body select:focus{outline:none;border-color:var(--yellow);box-shadow:0 0 0 2px rgba(242,194,48,.15)}
#export-body .adm-btn{background:transparent;border:1px solid rgba(255,255,255,.25);color:#e6e6e6;border-radius:9px;padding:10px 20px;font-family:'Oswald',sans-serif;font-weight:600;font-size:13px;letter-spacing:1px;text-transform:uppercase;cursor:pointer;transition:.12s}
#export-body .adm-btn:hover{border-color:var(--yellow);color:#fff}
#export-body .adm-btn.ghost{background:transparent}
#export-body .adm-btn[onclick*="download"]{background:var(--red);border-color:var(--red);color:#fff}
#export-body .adm-btn[onclick*="download"]:hover{filter:brightness(1.1)}
#export-body .adm-btn[onclick*="xls"]{background:var(--yellow);border-color:var(--yellow);color:#111}
#export-body .exp-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 20px}
#export-body .exp-chk{display:flex;align-items:center;gap:10px;color:#dfe2e7;font-size:14px;font-family:'Oswald',sans-serif;cursor:pointer;padding:8px 10px;border-radius:8px;transition:.12s}
#export-body .exp-chk:hover{background:rgba(255,255,255,.04)}
#export-body .exp-chk input[type=checkbox],#export-body input[type=checkbox]{width:19px;height:19px;accent-color:#D21F1F;cursor:pointer;flex:none}
#export-body label{color:#c3c7cf}
#export-body .exp-tblwrap{margin-top:12px;overflow-x:auto;border:1px solid var(--line);border-radius:10px}
#export-body .exp-tbl{width:100%;border-collapse:collapse;font-size:12px;font-family:'Oswald',sans-serif}
#export-body .exp-tbl th{background:var(--yellow);color:#111;text-align:left;padding:8px 10px;font-weight:600;white-space:nowrap;letter-spacing:.3px}
#export-body .exp-tbl td{padding:7px 10px;border-top:1px solid var(--line);color:#dfe2e7;white-space:nowrap}
#export-body .exp-tbl tbody tr:nth-child(even) td{background:rgba(255,255,255,.03)}
#export-body .adm-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:6px}
@media(max-width:520px){#export-body .exp-grid{grid-template-columns:1fr}}
#invgen-body .ig-in{background:#171719;border:1px solid rgba(255,255,255,.18);border-radius:8px;color:#fff;padding:10px 12px;font-family:'Oswald',sans-serif;font-size:13px;min-width:0}
#invgen-body .ig-rowres{position:absolute;top:100%;left:0;right:0;z-index:60;background:#0d0e10;border:1px solid rgba(242,194,48,.35);border-radius:9px;margin-top:3px;max-height:280px;overflow-y:auto;box-shadow:0 20px 50px -18px rgba(0,0,0,.9)}
#invgen-body .ig-in:focus{outline:none;border-color:var(--yellow)}
#invgen-body textarea.ig-in{resize:vertical;font-family:'Oswald',sans-serif}
.pw-meter{margin:6px 0 2px}
.pw-meter .pw-bar{height:5px;background:rgba(255,255,255,.12);border-radius:3px;overflow:hidden}
.pw-meter .pw-bar i{display:block;height:100%;width:0;background:#d21f1f;transition:.2s}
.pw-meter .pw-lbl{font-size:11px;letter-spacing:1px;text-transform:uppercase}
#sec-body .sec-block{margin-bottom:18px;padding-bottom:16px;border-bottom:1px solid rgba(255,255,255,.1)}
#sec-body .sec-block:last-of-type{border-bottom:none}
#sec-body h4{font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:1px;font-size:13px;color:var(--yellow);margin:0 0 10px}
#sec-body input{width:100%;padding:11px 13px;margin-bottom:9px;background:linear-gradient(180deg,#1f1f22,#171719);border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#fff;font-family:'Oswald',sans-serif;font-size:14px}
#sec-body input:focus{outline:none;border-color:var(--yellow);box-shadow:0 0 0 3px rgba(242,194,48,.18)}
#sec-body .sec-btn{width:100%;padding:12px;background:var(--red);border:none;border-radius:9px;color:#fff;font-family:'Racing Sans One',cursive;font-size:14px;letter-spacing:.5px;text-transform:uppercase;cursor:pointer;transition:.15s}
#sec-body .sec-btn:hover{background:#b81a1a}
#sec-body .sec-btn.ghost{background:transparent;border:1px solid rgba(255,255,255,.25);color:#ddd}
#sec-body .sec-note{color:#9aa0aa;font-size:12.5px;line-height:1.6;margin:0 0 12px}
#sec-body .sec-on{color:#2ec77a;font-size:13px;margin:0 0 12px}
#sec-body .sec-key{background:rgba(242,194,48,.08);border:1px dashed rgba(242,194,48,.4);border-radius:8px;padding:10px 12px;margin:6px 0;color:#eee;font-size:14px;text-align:center;letter-spacing:1px;font-family:'Oswald',sans-serif}
#sec-body .sec-qr{background:#fff;border-radius:12px;padding:10px;display:inline-block;margin:8px auto;text-align:center}
#sec-body .sec-qr img{display:block;image-rendering:pixelated;width:200px;height:200px}
#sec-body .sec-2fa-steps{font-size:13px;color:#c3c7cf;line-height:1.5;margin-bottom:4px}
#sec-body .sec-2fa-steps b{color:var(--yellow)}
#sec-body #sec-2fa-setup{text-align:center}
#sec-body .sec-key b{font-family:'Oswald',sans-serif;font-size:16px;letter-spacing:2px;color:var(--yellow)}
#sec-body .sec-uri{font-size:10px;color:#7a7f88;word-break:break-all;margin:0 0 10px;line-height:1.4}
#sec-body .sec-msg{text-align:center;font-size:13px;min-height:16px;margin-top:6px}
#sec-body .sec-msg.err{color:#ff6b6b}#sec-body .sec-msg.ok{color:#2ec77a}
/* dashboard */
.acct-wrap{max-width:1160px;margin:0 auto;display:grid;grid-template-columns:250px 1fr;gap:22px}
.acct-side{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:14px;padding:20px;height:max-content;position:sticky;top:90px}
.acct-prof{text-align:center;padding-bottom:18px;border-bottom:1px solid var(--line);margin-bottom:14px}
.acct-photo{width:96px;height:96px;border-radius:50%;object-fit:cover;background:#1a1a1c;border:2px solid var(--yellow);margin:0 auto 10px;display:block}
.acct-photo-ph{width:96px;height:96px;border-radius:50%;background:linear-gradient(135deg,#2a2a2a,#141414);border:2px solid var(--yellow);margin:0 auto 10px;display:flex;align-items:center;justify-content:center;font-family:'Racing Sans One';font-size:32px;color:var(--yellow)}
.acct-photo-btn{font-size:11px;color:var(--yellow);cursor:pointer;text-transform:uppercase;letter-spacing:1px}
.acct-name{font-family:'Oswald';font-weight:600;font-size:17px;color:#fff;margin-top:8px}
.acct-email{font-size:12px;color:var(--muted)}
.acct-nav{display:flex;flex-direction:column;gap:4px}
.acct-nav button{position:relative;text-align:left;padding:11px 14px;background:transparent;border:none;border-radius:8px;color:#cfcfcf;font-family:'Oswald';font-size:14px;letter-spacing:.5px;cursor:pointer;transition:.15s;display:flex;align-items:center;gap:10px}
.acct-nav button:hover{background:rgba(255,255,255,.05);color:#fff}
.acct-nav button.on{background:var(--yellow);color:#111;font-weight:600}
.acct-nav button.danger{color:#ff6b6b}
.acct-main{min-height:400px}
.acct-panel{display:none}.acct-panel.on{display:block}
#margin-body .mg-filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
#aff-body .dr-chip{display:inline-block;background:rgba(242,194,48,.12);border:1px solid rgba(242,194,48,.3);border-radius:20px;padding:4px 10px;margin:2px 4px 2px 0;color:#f0d68a}
#aff-body .dr-cap{font-weight:400;text-transform:none;letter-spacing:0;color:#7fe0a8;font-size:10.5px}
#aff-body .dr-suggest{background:rgba(46,199,122,.07);border:1px solid rgba(46,199,122,.3);border-radius:10px;padding:12px 14px;margin:10px 0;font-size:12.5px;color:#c3c7cf;line-height:1.5}
#aff-body .dr-suggest b{color:#7fe0a8}
#aff-body .dr-chip a{color:#ff6b6b;cursor:pointer;font-weight:700;margin-left:4px}
#margin-body .mg-in{background:#141416;border:1px solid rgba(255,255,255,.14);border-radius:8px;color:#fff;padding:9px 11px;font-family:'Oswald',sans-serif;font-size:13px;flex:1;min-width:120px}
#margin-body .mg-chk{display:flex;align-items:center;gap:6px;color:#c3c7cf;font-size:12px;white-space:nowrap}
#margin-body .mg-summary{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:8px;padding:10px 12px;font-size:12.5px;color:#c3c7cf;margin-bottom:10px}
#margin-body .mg-bulk{background:linear-gradient(135deg,rgba(46,199,122,.08),rgba(242,194,48,.06));border:1px solid rgba(46,199,122,.35);border-radius:12px;padding:14px 16px;margin-bottom:14px}
#margin-body .mg-bulk-t{font-family:'Oswald',sans-serif;font-weight:600;color:#7fe0a8;font-size:14px}
#margin-body .mg-bulk-t span{color:#9aa0aa;font-weight:400;font-size:12px}
#margin-body .mg-bulk-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:10px}
#margin-body .mg-bulk-row label{color:#c3c7cf;font-size:13px;font-family:'Oswald',sans-serif}
#margin-body .mg-bulk-hint{color:#9aa0aa;font-size:11.5px;margin-top:8px;line-height:1.5}
#margin-body #mg-bulk-out{font-size:12.5px;margin-top:8px;font-family:'Oswald',sans-serif}
#margin-body .mg-mkt{color:#8fb3d9;font-size:12.5px;white-space:nowrap}
/* Body Kits, toggle de segmento (Blacklist / Auto-R) */
#cat-bodykits .bk-seg-toggle{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin:8px auto 22px;max-width:760px}
#cat-bodykits .bk-seg{flex:1;min-width:260px;display:flex;align-items:center;gap:14px;background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:14px 18px;cursor:pointer;transition:.18s;text-align:left}
#cat-bodykits .bk-seg img{width:56px;height:56px;object-fit:contain;border-radius:10px;background:#141416;padding:5px;flex:none}
#cat-bodykits .bk-seg span{display:flex;flex-direction:column;gap:2px}
#cat-bodykits .bk-seg b{font-family:'Racing Sans One',sans-serif;color:#fff;font-size:15px}
#cat-bodykits .bk-seg small{color:#9aa0aa;font-size:12px;font-family:'Oswald',sans-serif}
#cat-bodykits .bk-seg:hover{border-color:rgba(242,194,48,.5);transform:translateY(-1px)}
#cat-bodykits .bk-seg.on{border-color:var(--yellow);background:linear-gradient(135deg,rgba(242,194,48,.12),rgba(210,31,31,.06));box-shadow:0 10px 30px -14px rgba(242,194,48,.6)}
#cat-bodykits .bk-seg.on b{color:var(--yellow)}
@media(max-width:640px){#cat-bodykits .bk-seg{min-width:100%}}
/* Age Gate 18+ (estilo jogo NFS) */
.age-ov{position:fixed;inset:0;z-index:8990;background:rgba(0,0,0,.92);display:none;align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(6px)}
.age-ov.on{display:flex}
.age-modal{max-width:460px;width:100%;background:linear-gradient(180deg,#111114,#0a0a0c);border:1px solid rgba(210,31,31,.4);border-radius:18px;padding:34px 30px;text-align:center;box-shadow:0 30px 90px -20px rgba(210,31,31,.4),0 0 0 1px rgba(255,255,255,.04);animation:ageIn .3s ease}
@keyframes ageIn{from{transform:translateY(30px) scale(.96);opacity:0}to{transform:none;opacity:1}}
.age-badge{width:64px;height:64px;margin:0 auto 16px;border-radius:14px;background:linear-gradient(135deg,#D21F1F,#ff4d4d);color:#fff;font-family:'Racing Sans One',sans-serif;font-size:24px;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 26px -8px rgba(210,31,31,.7);transform:rotate(-4deg)}
.age-title{font-family:'Racing Sans One',sans-serif;color:#fff;font-size:26px;margin-bottom:6px;letter-spacing:1px}
.age-sub{color:#c3c7cf;font-size:14px;font-family:'Oswald',sans-serif;margin-bottom:18px;line-height:1.5}
.age-sub b{color:var(--yellow)}
.age-points{display:flex;flex-direction:column;gap:9px;text-align:left;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:14px 16px;margin-bottom:20px}
.age-points span{color:#d7dae0;font-size:12.5px;font-family:'Oswald',sans-serif;line-height:1.4}
.age-btn{width:100%;background:linear-gradient(135deg,#D21F1F,#ff3b3b);border:none;border-radius:11px;color:#fff;font-family:'Racing Sans One',sans-serif;font-size:16px;letter-spacing:.5px;padding:15px;cursor:pointer;transition:.16s;box-shadow:0 10px 26px -10px rgba(210,31,31,.7)}
@media(max-width:640px){
  .age-btn{font-size:13px;padding:12px;border-radius:10px}
  .age-card{padding:18px 16px !important}
  /* modal de boas-vindas (Expert Guide) menor no mobile, não tampa a tela */
  #welcome-ov .age-card{max-width:94vw !important;padding:16px 14px !important}
  #welcome-ov h2{font-size:19px !important}
  #welcome-ov p{font-size:12.5px !important;margin-bottom:14px !important}
  #welcome-ov .wlc-btn{padding:12px 12px !important;gap:10px}
  #welcome-ov .wlc-btn .wlc-ic{font-size:20px}
  #welcome-ov .wlc-btn .wlc-tx b{font-size:14px}
  #welcome-ov .wlc-btn .wlc-tx small{font-size:11px;line-height:1.35}
}
.age-btn:hover{filter:brightness(1.1);transform:translateY(-2px)}
.age-links{margin-top:14px;font-family:'Oswald',sans-serif;font-size:12px;color:#7a7f88}
.age-links a{color:#9aa0aa;text-decoration:none;transition:.15s}
.age-links a:hover{color:var(--yellow)}
/* Legal (termos/privacidade) */
#legal-body{max-height:60vh;overflow-y:auto;text-align:left;font-family:'Oswald',sans-serif;color:#c3c7cf;font-size:13.5px;line-height:1.6;padding-right:8px}
#legal-body h4{color:var(--yellow);font-family:'Racing Sans One',sans-serif;font-size:14px;margin:18px 0 6px}
#legal-body p{margin:0 0 10px}
#legal-body b{color:#fff}
.legal-tabs{display:flex;gap:8px;justify-content:center;margin:6px 0 16px}
.legal-tab{background:transparent;border:1px solid rgba(255,255,255,.18);border-radius:999px;color:#cfd2d8;font-family:'Oswald',sans-serif;font-size:12.5px;padding:8px 18px;cursor:pointer;transition:.15s}
.legal-tab.on{background:var(--yellow);color:#141414;border-color:var(--yellow);font-weight:600}
/* Performance, chips de subcategoria (shop by part type) */

.perfsub-row{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;max-width:1000px;margin:0 auto 26px}
.perfsub-chip{display:flex;align-items:center;gap:8px;background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:10px 18px;cursor:pointer;transition:.16s;font-family:'Oswald',sans-serif;font-size:13.5px;color:#d7dae0;letter-spacing:.4px}
.perfsub-chip .pc-ico{font-size:16px}
.perfsub-chip .pc-n{color:#7a7f88;font-size:11px}
.perfsub-chip:hover{border-color:rgba(242,194,48,.5);color:#fff;transform:translateY(-1px)}
.perfsub-chip.on{background:linear-gradient(135deg,var(--yellow),#ffd968);color:#141414;border-color:var(--yellow);font-weight:600;box-shadow:0 8px 20px -10px rgba(242,194,48,.6)}
.perfsub-chip.on .pc-n{color:rgba(20,20,20,.6)}
/* Promoções, painel profissional */
#promos-body .promo-create{background:linear-gradient(135deg,rgba(210,31,31,.09),rgba(242,194,48,.06));border:1px solid rgba(242,194,48,.28);border-radius:14px;padding:20px 22px;margin-bottom:16px}
#promos-body .promo-create-t{font-family:'Racing Sans One',sans-serif;color:var(--yellow);font-size:17px;margin-bottom:16px}
#promos-body .promo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
#promos-body .promo-f{display:flex;flex-direction:column;gap:6px}
#promos-body .promo-f label{font-family:'Oswald',sans-serif;font-size:11px;text-transform:uppercase;letter-spacing:1px;color:#9aa0aa}
#promos-body .promo-in{background:#141416;border:1px solid rgba(255,255,255,.16);border-radius:9px;color:#fff;padding:11px 13px;font-family:'Oswald',sans-serif;font-size:14px;width:100%}
#promos-body .promo-in:focus{outline:none;border-color:var(--yellow)}
#promos-body .promo-amt{position:relative;display:flex;align-items:center}
#promos-body .promo-amt span{position:absolute;left:13px;color:var(--yellow);font-family:'Racing Sans One',sans-serif;font-size:15px;pointer-events:none}
#promos-body .promo-amt input{padding-left:32px}
#promos-body .promo-actions{display:flex;align-items:center;gap:16px;margin-top:18px}
#promos-body .promo-btn-go{background:linear-gradient(135deg,#D21F1F,#ff4d4d);color:#fff;border:none;border-radius:10px;padding:13px 28px;font-family:'Oswald',sans-serif;font-weight:600;font-size:14px;letter-spacing:.5px;text-transform:uppercase;cursor:pointer;transition:.15s;box-shadow:0 8px 20px -6px rgba(210,31,31,.6)}
#promos-body .promo-btn-go:hover{filter:brightness(1.1);transform:translateY(-1px)}
#promos-body #pr-out{font-family:'Oswald',sans-serif;font-size:13px}
#promos-body .promo-list-t{font-family:'Racing Sans One',sans-serif;color:#fff;font-size:15px;margin-bottom:12px}
#promos-body .promo-empty{color:#8a8f98;font-size:13px;padding:20px;text-align:center;border:1px dashed rgba(255,255,255,.12);border-radius:12px}
#promos-body .promo-item{display:flex;align-items:center;gap:14px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.09);border-radius:12px;padding:12px 16px;margin-bottom:10px}
#promos-body .promo-item.promo-off{opacity:.55}
#promos-body .promo-badge2{background:linear-gradient(135deg,#D21F1F,#ff4d4d);color:#fff;font-family:'Racing Sans One',sans-serif;font-size:15px;padding:8px 14px;border-radius:9px;white-space:nowrap;flex:none}
#promos-body .promo-meta{flex:1}
#promos-body .promo-scope{font-family:'Oswald',sans-serif;font-size:15px;color:#fff}
#promos-body .promo-sub{font-size:12px;color:#9aa0aa;margin-top:2px}
#promos-body .promo-toggle{position:relative;width:44px;height:24px;flex:none;cursor:pointer}
#promos-body .promo-toggle input{opacity:0;width:0;height:0}
#promos-body .promo-toggle span{position:absolute;inset:0;background:#3a3a3e;border-radius:24px;transition:.2s}
#promos-body .promo-toggle span:before{content:'';position:absolute;width:18px;height:18px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s}
#promos-body .promo-toggle input:checked+span{background:#2ec77a}
#promos-body .promo-toggle input:checked+span:before{transform:translateX(20px)}
@media(max-width:720px){#promos-body .promo-grid{grid-template-columns:1fr}}
#margin-body .mg-table{width:100%;border-collapse:collapse;font-size:12px;font-family:'Oswald',sans-serif}
#margin-body .mg-table th{background:rgba(46,199,122,.12);color:#7fe0a8;text-align:left;padding:8px 9px;text-transform:uppercase;letter-spacing:.5px;font-size:10px;white-space:nowrap;position:sticky;top:0}
#margin-body .mg-table td{padding:7px 9px;border-top:1px solid rgba(255,255,255,.07);color:#dfe2e7;vertical-align:middle}
#margin-body .mg-table tbody tr:nth-child(even) td{background:rgba(255,255,255,.02)}
#margin-body .mg-name{color:#fff;max-width:230px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#margin-body .mg-prod{display:flex;align-items:center;gap:11px}
#margin-body .mg-thumb{position:relative;width:46px;height:46px;flex:none;border-radius:8px;overflow:hidden;background:#0d0e11;border:1px solid #262a32;cursor:pointer;transition:.15s}
#margin-body .mg-thumb:hover{border-color:var(--yellow);transform:scale(1.06)}
#margin-body .mg-thumb img{width:100%;height:100%;object-fit:contain}
#margin-body .mg-thumb .mg-zoomic{position:absolute;bottom:1px;right:2px;font-size:10px;opacity:.7}
#margin-body .mg-thumb-none{background:repeating-linear-gradient(45deg,#16181d,#16181d 5px,#1b1e24 5px,#1b1e24 10px);cursor:default}
#mg-zoom-ov{display:none;position:fixed;inset:0;z-index:11000;background:rgba(0,0,0,.88);align-items:center;justify-content:center;padding:24px;cursor:zoom-out}
#mg-zoom-ov .mg-zoom-box{position:relative;max-width:min(680px,92vw);max-height:88vh;background:#0c0d10;border:1px solid rgba(242,194,48,.4);border-radius:14px;padding:16px;box-shadow:0 40px 100px -30px #000}
#mg-zoom-ov .mg-zoom-box img{max-width:100%;max-height:72vh;object-fit:contain;border-radius:8px;display:block;margin:0 auto}
#mg-zoom-ov .mg-zoom-cap{color:#dfe2e7;font-family:'Oswald',sans-serif;font-size:14px;text-align:center;margin-top:12px}
#mg-zoom-ov .mg-zoom-x{position:absolute;top:10px;right:12px;background:var(--red);border:none;color:#fff;width:34px;height:34px;border-radius:8px;font-size:20px;cursor:pointer}
#margin-body .mg-pn{color:#7a7f88;font-size:10px}
#margin-body .mg-edit{width:78px;background:#0e0f11;border:1px solid rgba(255,255,255,.16);border-radius:6px;color:#fff;padding:6px 7px;font-family:'Oswald',sans-serif;font-size:12px}
#margin-body .mg-edit:focus{outline:none;border-color:var(--yellow)}
#margin-body .mg-del{background:transparent;border:1px solid rgba(210,31,31,.4);color:#ff6b6b;border-radius:6px;width:26px;height:26px;cursor:pointer;font-size:15px;line-height:1}
#margin-body .mg-pager{display:flex;gap:12px;align-items:center;justify-content:center;margin-top:12px;color:#c3c7cf;font-family:'Oswald',sans-serif;font-size:13px}
#margin-body .mg-pgbtn{background:var(--red);color:#fff;border:none;border-radius:8px;padding:8px 16px;font-family:'Oswald',sans-serif;cursor:pointer}
#margin-body .mg-pgbtn:disabled{opacity:.4;cursor:default}
#aff-body .adm-card{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:12px;padding:18px 20px}
#aff-body .adm-card h3{font-family:'Racing Sans One',cursive;color:var(--yellow);margin:0 0 4px;letter-spacing:.5px}
#aff-body .hint{color:#9aa0aa;font-size:12px;margin-bottom:12px;line-height:1.5}
#aff-body .ig-row{display:flex;gap:10px;margin-bottom:10px;flex-wrap:wrap}
#aff-body .ig-in{flex:1;min-width:140px;background:#141416;border:1px solid rgba(255,255,255,.14);border-radius:9px;color:#fff;padding:11px 13px;font-family:'Oswald',sans-serif;font-size:13px}
#aff-body .ig-in::placeholder{color:#6b6f77}
#aff-body .ig-in:focus{outline:none;border-color:var(--yellow);box-shadow:0 0 0 2px rgba(242,194,48,.15)}
#aff-body select.ig-in{cursor:pointer}
#aff-body label{color:#c3c7cf}
#aff-body .adm-btn{background:var(--yellow);color:#111;border:none;border-radius:9px;padding:11px 20px;font-family:'Oswald',sans-serif;font-weight:600;font-size:13px;letter-spacing:.5px;text-transform:uppercase;cursor:pointer;transition:.12s}
#aff-body .adm-btn:hover{filter:brightness(1.08)}
#aff-body .adm-btn.ghost{background:transparent;border:1px solid rgba(255,255,255,.25);color:#ddd}
#aff-body .adm-table{width:100%;border-collapse:collapse;font-size:13px;font-family:'Oswald',sans-serif}
#aff-body .adm-table th{background:rgba(210,31,31,.12);color:#ff8a8a;text-align:left;padding:10px 12px;text-transform:uppercase;letter-spacing:1px;font-size:10px}
#aff-body .adm-table td{padding:10px 12px;border-top:1px solid rgba(255,255,255,.07);color:#dfe2e7}
#aff-body .adm-table tbody tr:nth-child(even) td{background:rgba(255,255,255,.02)}
#aff-body .aff-active-lbl{display:flex;align-items:center;gap:8px;color:#c3c7cf;font-size:13px;margin-top:10px;font-family:'Oswald',sans-serif}
#aff-body input[type=checkbox]{width:17px;height:17px;accent-color:#D21F1F;cursor:pointer}
#aff-dash .aff-hero{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:16px}
#aff-dash .aff-couponbox{background:linear-gradient(135deg,rgba(210,31,31,.15),rgba(242,194,48,.1));border:1px dashed var(--yellow);border-radius:14px;padding:18px 26px;text-align:center}
#aff-dash .acct-table{width:100%;border-collapse:collapse;font-size:12.5px;font-family:'Oswald',sans-serif}
#aff-dash .acct-table th{background:rgba(242,194,48,.1);color:#f0d68a;text-align:left;padding:8px 10px;text-transform:uppercase;font-size:10px;letter-spacing:.5px}
#aff-dash .acct-table td{padding:8px 10px;border-top:1px solid rgba(255,255,255,.07);color:#dfe2e7}
#aff-dash .cf-field label{display:block;font-size:11px;text-transform:uppercase;letter-spacing:1px;color:#9aa0aa;margin-bottom:4px}
#aff-dash .cf-field input{width:100%;background:#141416;border:1px solid rgba(255,255,255,.14);border-radius:8px;color:#fff;padding:10px 12px;font-family:'Oswald',sans-serif;font-size:14px}
#aff-dash .aff-couponbox span{display:block;font-size:11px;letter-spacing:1px;text-transform:uppercase;color:#c3c7cf}
#aff-dash .aff-couponbox b{font-family:'Racing Sans One',cursive;font-size:34px;color:#fff;letter-spacing:2px;display:block;margin:4px 0}
#aff-dash .aff-couphint{font-size:12px;color:#9aa0aa}
#aff-dash .aff-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media(max-width:600px){#aff-dash .aff-stats{grid-template-columns:1fr}}
#aff-dash .aff-stat{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:12px;padding:16px;text-align:center}
#aff-dash .aff-stat .v{font-family:'Racing Sans One',cursive;font-size:24px;color:#fff}
#aff-dash .aff-stat .l{font-size:11px;color:#9aa0aa;text-transform:uppercase;letter-spacing:1px;margin-top:4px}
#mygames-list .mg-row{display:flex;align-items:center;gap:16px;padding:14px;border:1px solid var(--line);border-radius:12px;margin-bottom:12px;background:rgba(255,255,255,.02)}
#mygames-list .mg-cover{width:64px;height:64px;object-fit:contain;background:#0a0a0a;border-radius:8px;flex:none}
#mygames-list .mg-info{flex:1;min-width:0}
#mygames-list .mg-name{font-family:'Oswald',sans-serif;font-weight:600;color:#fff;font-size:16px}
#mygames-list .mg-year{color:#8a8f98;font-size:12px;margin:2px 0 8px}
#mygames-list .mg-dl{display:inline-block;background:var(--red);color:#fff;text-decoration:none;font-family:'Oswald',sans-serif;font-size:13px;letter-spacing:.5px;padding:8px 16px;border-radius:8px}
#mygames-list .mg-dl:hover{filter:brightness(1.1)}
#mygames-list .mg-qrwrap{flex:none;text-align:center}
#mygames-list .mg-lockmsg{color:#e6a417;font-size:12.5px;font-family:'Oswald',sans-serif;margin-top:6px;display:flex;align-items:center;gap:6px}
#mygames-list .mg-qrlock{display:flex;flex-direction:column;align-items:center;justify-content:center;width:88px;height:88px;background:rgba(230,164,23,.08);border:1px dashed rgba(230,164,23,.4);border-radius:10px}
#mygames-list .mg-qrx{font-size:26px}
#mygames-list .mg-qrlock span{font-size:10px;color:#e6a417;letter-spacing:1px;text-transform:uppercase;margin-top:3px}
#mygames-list .mg-locked{opacity:.85}
#mygames-list .mg-qr{width:76px;height:76px;background:#fff;padding:4px;border-radius:8px;display:block}
#mygames-list .mg-qrwrap span{font-size:10px;color:#8a8f98;display:block;margin-top:4px}
@media(max-width:560px){#mygames-list .mg-qrwrap{display:none}}
.acct-card{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:14px;padding:22px;margin-bottom:18px}
.acct-card h3{font-family:'Racing Sans One',cursive;color:#fff;font-size:18px;letter-spacing:.5px;margin:0 0 4px;text-transform:uppercase}
.acct-card .hint{color:var(--muted);font-size:12px;margin-bottom:16px}
.acct-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.acct-grid .full{grid-column:1/-1}
.acct-grid label{display:block;font-size:11px;letter-spacing:1px;text-transform:uppercase;color:#bdbdbd;margin-bottom:6px}
.acct-grid input{width:100%;padding:11px 13px;background:linear-gradient(180deg,#1f1f22,#171719);border:1px solid rgba(255,255,255,.16);border-radius:9px;color:#fff;font-family:'Oswald';font-size:14px}
.acct-grid input:focus{outline:none;border-color:var(--yellow)}
.acct-save{margin-top:16px;padding:12px 26px;background:var(--yellow);border:none;border-radius:9px;color:#111;font-family:'Racing Sans One';font-size:14px;text-transform:uppercase;letter-spacing:.5px;cursor:pointer}
.acct-save:hover{background:#e0b02c}
.acct-stat{display:flex;gap:14px;flex-wrap:wrap}
.acct-stat .s{flex:1;min-width:140px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:12px;padding:16px}
.acct-stat .s .n{font-family:'Racing Sans One';font-size:26px;color:var(--yellow)}
.acct-stat .s .l{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:1px}
.reorder-row{display:flex;gap:12px;flex-wrap:wrap}
.reorder-chip{flex:1;min-width:180px;display:flex;align-items:center;justify-content:space-between;gap:10px;background:rgba(242,194,48,.07);border:1px solid rgba(242,194,48,.35);border-radius:10px;padding:12px 14px}
.reorder-chip .t{font-family:'Oswald';color:#fff;font-size:13px}
.reorder-chip button{background:var(--yellow);border:none;border-radius:7px;padding:7px 12px;color:#111;font-family:'Oswald';font-weight:600;font-size:12px;text-transform:uppercase;cursor:pointer;white-space:nowrap}
.order-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0;border-bottom:1px solid var(--line)}
.order-item:last-child{border-bottom:none}
.order-item .oi-l .c{font-family:'Oswald';font-weight:600;color:#fff}
.order-item .oi-l .d{font-size:12px;color:var(--muted)}
.order-item .oi-r{text-align:right}
.order-item .oi-r .tot{font-family:'Racing Sans One';color:var(--yellow)}
.order-badge{display:inline-block;font-size:11px;padding:3px 9px;border-radius:20px;letter-spacing:.5px}
.order-badge.ship,.order-badge.done{background:rgba(46,199,122,.16);color:#2ec77a;border:1px solid rgba(46,199,122,.45)}
.order-badge.proc{background:rgba(226,59,59,.15);color:#ff5a5a;border:1px solid rgba(226,59,59,.45)}
.order-badge.paid{background:rgba(242,194,48,.15);color:#F2C230;border:1px solid rgba(242,194,48,.5)}
.order-badge.off{background:rgba(255,255,255,.06);color:#9aa0aa;border:1px solid rgba(255,255,255,.15)}
/* tracking */
.track-card{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:12px;padding:18px 20px;margin-bottom:14px}
.track-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.track-head .t{font-family:'Oswald';font-weight:600;color:#fff;font-size:15px}
.track-head .code{font-size:12px;color:var(--muted)}
.track-steps{display:flex;align-items:center}
.track-step{flex:1;text-align:center;position:relative}
.track-step .dot{width:26px;height:26px;border-radius:50%;background:#1a1a1c;border:2px solid var(--line);margin:0 auto 8px;display:flex;align-items:center;justify-content:center;font-size:13px;color:#666;position:relative;z-index:1}
.track-step .lbl{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}
.track-step::before{content:"";position:absolute;top:13px;left:-50%;width:100%;height:2px;background:var(--line);z-index:0}
.track-step:first-child::before{display:none}
.track-step.done .dot{background:var(--yellow);border-color:var(--yellow);color:#111}
.track-step.done::before{background:var(--yellow)}
.track-step.done .lbl{color:#fff}
.track-step.cur .dot{border-color:var(--yellow);color:var(--yellow);box-shadow:0 0 0 4px rgba(242,194,48,.15)}
@media(max-width:820px){.acct-wrap{grid-template-columns:1fr}.acct-side{position:static}}
/* ===== ADMIN + CONTA no MOBILE/TABLET, barra vertical fina à esquerda ===== */
@media(max-width:900px){
  /* NADA rola pro lado, tudo cabe na largura da tela, com margem nas laterais */
  html,body{overflow-x:hidden !important;overflow-x:clip !important;max-width:100vw}
  #cat-admin,#cat-account{overflow-x:hidden !important;overflow-x:clip !important;padding-left:8px !important;padding-right:8px !important;box-sizing:border-box}
  .adm-wrap,.acct-wrap{box-sizing:border-box;padding:0}
  /* botões sempre inteiros, com a mensagem completa, sem cortar */
  .adm-btn,.acct-nav button,.golive-btn,.set-btn,.bchip{max-width:100%;white-space:normal;overflow-wrap:anywhere}
  .adm-wrap,.acct-wrap{grid-template-columns:74px minmax(0,1fr) !important;gap:9px !important;max-width:100% !important;align-items:start}
  .adm-side,.acct-side{position:sticky !important;top:8px;padding:5px !important;border-radius:14px;margin:0 !important;max-height:calc(100vh - 20px);overflow-y:auto;scrollbar-width:none;display:flex !important;flex-direction:column !important;align-items:stretch !important}
  .adm-nav,.acct-nav{align-self:stretch !important}
  .adm-side::-webkit-scrollbar,.acct-side::-webkit-scrollbar{display:none}
  .adm-side .adm-badge,.acct-side .acct-badge,.acct-side .adm-badge{display:none !important}
  /* perfil do cliente compacto na barra estreita (foto menor, respiro) */
  .acct-side .acct-prof{padding:4px 2px 8px !important}
  .acct-side .acct-photo,.acct-side .acct-photo-ph{width:46px !important;height:46px !important;margin:0 auto 6px !important;font-size:18px !important;border-width:1.5px !important}
  .acct-side .acct-photo-btn{font-size:8.5px !important;letter-spacing:.3px !important;line-height:1.15;display:block;text-align:center}
  .acct-side .acct-name{font-size:12px !important;text-align:center;line-height:1.2;margin-top:2px}
  .acct-side .acct-email{font-size:8.5px !important;text-align:center;word-break:break-all;line-height:1.2;margin-top:2px}
  .acct-side .acct-help{font-size:9px !important;padding:4px 8px !important;margin:5px auto !important;display:block}
  /* barra vertical: ícones empilhados com label pequeno embaixo (não quebra palavra) */
  .adm-nav,.acct-nav{flex-direction:column !important;gap:5px !important;overflow:visible !important;width:100% !important;align-items:stretch !important}
  .adm-nav button,.acct-nav button,.acct-side .acct-nav a{
    flex-direction:column !important;align-items:center !important;justify-content:center !important;
    gap:3px !important;padding:8px 3px !important;font-size:9px !important;line-height:1.15 !important;
    text-align:center !important;white-space:normal !important;word-break:normal !important;overflow-wrap:break-word !important;hyphens:none !important;
    border-radius:10px !important;border:1px solid transparent !important;letter-spacing:0 !important;min-height:52px;position:relative;
    width:100% !important;box-sizing:border-box !important;overflow:hidden}
  .adm-nav button svg,.acct-nav button svg{width:20px !important;height:20px !important;margin:0 !important;flex:none}
  /* largura explícita: botão preenche a sidebar e o texto encaixa dentro do amarelo */
  .adm-nav button,.acct-nav button,.acct-side .acct-nav a{width:calc(100% - 0px) !important;min-width:0 !important;max-width:100% !important}
  .adm-nav,.acct-nav{width:100% !important;min-width:0}
  /* padding da barra reduzido (vence o 18px) pra o botão preencher e o texto encaixar no amarelo */
  .adm-wrap .adm-side,.acct-wrap .acct-side,#cat-admin .adm-side,#cat-account .acct-side{padding:5px !important}
  .adm-nav button.on,.acct-nav button.on{background:var(--yellow) !important;color:#111 !important}
  .adm-nav button .adm-navbadge{position:absolute;top:2px;right:6px}
  /* conteúdo: nunca empurra a página; tabelas rolam dentro do card */
  .adm-main,.acct-main{min-width:0 !important;overflow:hidden}
  .adm-card,.acct-card{max-width:100% !important;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .adm-panel,.acct-panel{min-width:0}
  /* ===== TABELAS viram CARDS empilhados (celular vertical E horizontal): só rola pra baixo ===== */
  .adm-card,.acct-card{overflow-x:visible !important}
  .adm-card>div[style*="overflow-x"]{overflow-x:visible !important}
  .adm-table{min-width:0 !important;width:100% !important;display:block}
  .adm-table thead{display:none}
  .adm-table tbody{display:block;width:100%}
  .adm-table tr{display:block;width:100%;background:rgba(255,255,255,.025);border:1px solid var(--line);border-radius:12px;margin-bottom:10px;padding:12px 12px 12px 12px;position:relative;box-sizing:border-box}
  .adm-table td{display:block;width:100% !important;max-width:100% !important;border:none !important;padding:5px 0;text-align:left !important;white-space:normal !important;box-sizing:border-box}
  .adm-table td:empty{display:none}
  .adm-table td .adm-row{flex-wrap:wrap;gap:6px}
  .adm-table td .adm-btn{flex:1 1 40%;text-align:center}
  .adm-table td input,.adm-table td select,.adm-table td .adm-in,.adm-table td .adm-sel{width:100% !important;max-width:100% !important;min-width:0 !important;box-sizing:border-box}
  .adm-table td .trk-row{flex-wrap:wrap;gap:4px}
  .adm-table td.trk-cell,.adm-table td .trk-cell{min-width:0 !important;width:100% !important;max-width:100% !important}
  .adm-table .trk-row input,.adm-table .trk-c,.adm-table .trk-u{width:100% !important;flex:1 1 100% !important;min-width:0 !important}
  .adm-table .trk-lbl{width:auto !important;flex:1 1 100%}
  .adm-table td>div[style*="min-width"]{min-width:0 !important}
  .adm-table td:first-child{position:absolute;top:10px;right:12px;width:auto !important;padding:0}
}
@media(max-width:640px){
  .adm-card{padding:14px}
  .adm-card h3{font-size:15px;line-height:1.3}
  /* headers com texto explicativo ao lado: empilha em vez de quebrar feio */
  .adm-card h3 span{display:block;font-size:11px;margin-top:2px}
  .adm-row{flex-wrap:wrap;gap:8px}
  .adm-kpis{grid-template-columns:repeat(2,1fr) !important;gap:8px}
  .adm-kpi{padding:12px}
  .adm-kpi .v{font-size:20px}
  .adm-in,.adm-sel{padding:9px 10px !important;font-size:13px !important;max-width:100%}
  .adm-btn{padding:9px 12px !important;font-size:12px !important}
  .adm-table{font-size:11px;min-width:520px}
  .adm-table th,.adm-table td{padding:6px 8px}
  .adm-grid2,.set-panel,#set-panel,.bk-grid,.an-grid2,.an-grid4,.cc-tiles,.rw-levels,.mb-grid,.aff-bankbox{grid-template-columns:1fr !important;gap:10px !important}
  .an-grid4{grid-template-columns:1fr 1fr !important}
  .cc-tiles{grid-template-columns:1fr 1fr !important}
  .mb-grid{grid-template-columns:1fr 1fr !important}
  /* NÚMEROS dos indicadores proporcionais (não gigantes vs label) */
  .an-kpi{padding:12px !important}
  .an-kpi .v{font-size:19px !important}
  .an-kpi .l{font-size:10px !important;margin-top:3px !important}
  .adm-kpi{padding:12px !important}
  .adm-kpi .v{font-size:18px !important}
  .adm-kpi .l,.adm-kpi span{font-size:10px !important}
  .cc-tile .v,.cc-tile b{font-size:20px !important}
  .cc-tile span,.cc-tile small{font-size:10px !important}
  .mb-sumcard b{font-size:16px !important}
  .mb-sumcard span{font-size:10.5px !important}
  /* RECEIVED/PENDING do orders proporcional */
  #adm-orders-summary b,.adm-summary b{font-size:20px !important}
  /* barras de ação e busca: quebram limpo, sem estourar */
  .adm-bulk,.ord-search,.mb-controls{flex-wrap:wrap;gap:8px}
  .ord-search input,.mb-searchbox,.dr-brandfilter input{min-width:0;width:100%;flex:1 1 100%}
  .sc-body,.mb-controls{flex-wrap:wrap}
  .score-card .sc-gauge svg,#cat-account .sc-gauge svg{max-width:100%;height:auto}
}
/* ===== PAINEL ADM ===== */
.adm-wrap{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:230px minmax(0,1fr);gap:22px}
.adm-main{min-width:0;overflow:hidden}
@media(max-width:900px){.adm-wrap{grid-template-columns:1fr;gap:14px}}
/* ===== ADMIN MOBILE: respiro + toda barra de botões QUEBRA (nada estoura, como tinha nas rodas) ===== */
@media(max-width:768px){
  .adm-wrap{padding:0 2px}
  .adm-side{position:static;top:auto;padding:12px;margin-bottom:4px}
  .adm-nav{flex-direction:row;flex-wrap:wrap;gap:6px}
  .adm-nav button{padding:9px 11px;font-size:13px}
  .adm-card{padding:16px 15px;margin-bottom:14px;border-radius:13px}
  .adm-card h3{font-size:15.5px}
  /* qualquer linha/barra de ações quebra em vez de estourar */
  .adm-card .row,.adm-row,.adm-actions,.adm-bulk,.pay-actions,.pay-row,.dev-row,.set-row,.mapcfg-tabs,.mcfg-tabs,.sub-tabs,.filter-actions,.pja-acts,.io-row,.mb-controls,.ord-search{flex-wrap:wrap !important;gap:8px !important}
  /* botões, inputs e selects cabem 100% */
  .adm-card button,.adm-card .btn,.dev-btn,.adm-card input,.adm-card select,.adm-card textarea{max-width:100%;box-sizing:border-box}
  .adm-card input,.adm-card select,.adm-card textarea{width:100%}
  .adm-card button,.adm-card .btn,.dev-btn{flex:0 1 auto}
  /* respiro entre blocos e cards */
  .adm-kpis{gap:10px}
  .cc-tiles{gap:10px}
  .pja-row{padding:11px;gap:10px}
  .adm-card>*+*{margin-top:2px}
}
.pja-row.pja-off{opacity:.5}
.pja-row.pja-off .pja-thumb{filter:grayscale(1)}
.adm-side{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:14px;padding:16px;height:max-content;position:sticky;top:90px}
.adm-side .adm-badge{display:flex;align-items:center;gap:8px;font-family:'Racing Sans One';color:#fff;font-size:15px;padding:6px 6px 14px;border-bottom:1px solid var(--line);margin-bottom:10px}
.adm-side .adm-badge b{color:var(--yellow)}
.adm-nav{display:flex;flex-direction:column;gap:3px}
.help-btn{margin-left:auto;width:26px;height:26px;border-radius:50%;background:var(--yellow);color:#111;border:none;font-family:'Oswald',sans-serif;font-weight:700;font-size:15px;cursor:pointer;line-height:1;flex:none;transition:.15s}
.help-btn:hover{filter:brightness(1.1);transform:scale(1.1)}
.help-btn.acct-help{width:auto;border-radius:16px;padding:6px 14px;font-size:12px;letter-spacing:.5px;margin:8px auto 0;display:block}
#help-body .help-intro{color:#e6e6e6;font-size:14px;margin:6px 0 16px;font-family:'Oswald',sans-serif;line-height:1.5}
#help-body .help-item{display:flex;gap:14px;align-items:flex-start;padding:13px 0;border-bottom:1px solid rgba(255,255,255,.07)}
#help-body .help-ico{width:38px;height:38px;flex:none;display:flex;align-items:center;justify-content:center;background:rgba(242,194,48,.12);border:1px solid rgba(242,194,48,.3);border-radius:9px;font-size:18px}
#help-body .help-tx{display:flex;flex-direction:column;gap:3px}
#help-body .help-tx b{color:var(--yellow);font-family:'Oswald',sans-serif;font-size:15px;letter-spacing:.3px}
#help-body .help-tx span{color:#c3c7cf;font-size:13px;line-height:1.55}
#help-body .help-foot{margin-top:16px;background:rgba(46,199,122,.07);border:1px solid rgba(46,199,122,.25);border-radius:10px;padding:12px 14px;color:#c3c7cf;font-size:12.5px;line-height:1.5}
.adm-nav button{display:flex;align-items:center;gap:11px;text-align:left;padding:11px 13px;background:transparent;border:none;border-radius:8px;color:#cfcfcf;font-family:'Oswald';font-size:14px;letter-spacing:.4px;cursor:pointer;transition:.15s}
.adm-nav button svg{width:18px;height:18px;flex:none;stroke:currentColor}
.adm-nav button:hover{background:rgba(255,255,255,.05);color:#fff}
.adm-nav button.on{background:var(--yellow);color:#111;font-weight:600}
.adm-nav button.danger{color:#ff6b6b;margin-top:8px;border-top:1px solid var(--line);border-radius:0 0 8px 8px}
.adm-panel{display:none}.adm-panel.on{display:block}
.adm-card{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:14px;padding:20px;margin-bottom:18px}
.adm-card h3{font-family:'Racing Sans One';color:#fff;font-size:17px;letter-spacing:.5px;margin:0 0 4px;text-transform:uppercase}
.adm-card .hint{color:var(--muted);font-size:12px;margin-bottom:14px}
.adm-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px}
/* command center */
.cc-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-top:6px}
/* banner de promoção (menu) */
#promo-banner{position:fixed;left:20px;bottom:calc(14vh + 120px);z-index:60;background:linear-gradient(135deg,#D21F1F,#8f1414);border:1px solid rgba(242,194,48,.5);border-radius:14px;padding:14px 18px 14px 16px;max-width:290px;cursor:pointer;box-shadow:0 16px 40px -12px rgba(210,31,31,.7);transform:translateX(-130%);opacity:0;transition:transform .5s cubic-bezier(.2,.9,.3,1.2),opacity .4s;pointer-events:none}
/* selo Google no menu principal, discreto, canto inferior esquerdo */
#google-badge{display:none !important}
#google-badge:hover{border-color:rgba(242,194,48,.5);transform:translateY(-2px)}
#google-badge .gb-logo{flex:none}
#google-badge .gb-stars{color:#FFC107;font-size:12px;letter-spacing:1px;line-height:1}
#google-badge .gb-rate{color:#fff;font-family:'Oswald',sans-serif;font-weight:600;font-size:12.5px}
body.entered-site #google-badge,#capa.entered #google-badge{display:none}
@media(max-width:640px){#google-badge{left:10px;bottom:10px;padding:5px 10px 5px 8px}#google-badge .gb-stars{font-size:11px}}
#promo-banner.on{transform:translateX(0);opacity:1;pointer-events:auto}
#promo-banner .pb-x{position:absolute;top:8px;right:10px;background:rgba(0,0,0,.25);border:none;color:#fff;width:22px;height:22px;border-radius:50%;font-size:15px;cursor:pointer;line-height:1;display:flex;align-items:center;justify-content:center}
#promo-banner .pb-x:hover{background:rgba(0,0,0,.5)}
#promo-banner .pb-tag{font-family:'Oswald',sans-serif;font-size:10px;letter-spacing:2px;color:var(--yellow);font-weight:700;text-transform:uppercase;margin-bottom:6px}
#promo-banner .pb-body{display:flex;flex-direction:column;gap:2px;margin-bottom:8px}
#promo-banner .pb-amt{font-family:'Racing Sans One',cursive;color:#fff;font-size:22px;line-height:1.1}
#promo-banner .pb-on{color:#ffd9d9;font-size:13px;font-family:'Oswald',sans-serif}
#promo-banner .pb-count{color:rgba(255,255,255,.5);font-size:10px;margin-top:2px}
#promo-banner .pb-cta{font-family:'Oswald',sans-serif;font-size:11px;color:var(--yellow);text-transform:uppercase;letter-spacing:1px;font-weight:600}
@media(max-width:640px){#promo-banner{left:10px;right:10px;max-width:none;bottom:auto;top:70px}}
/* maintenance gate */
#maint-gate{position:fixed;inset:0;z-index:200000;background:radial-gradient(ellipse at center,#111 0%,#050506 100%);display:none;align-items:center;justify-content:center;padding:24px}
#maint-gate.on{display:flex}
#maint-gate .mg-inner{max-width:460px;width:100%;text-align:center}
#maint-gate .mg-logo{max-width:280px;width:80%;margin:0 auto 24px;display:block;filter:drop-shadow(0 0 20px rgba(0,0,0,.8))}
#maint-gate .mg-title{font-family:'Racing Sans One',cursive;color:var(--yellow);font-size:clamp(18px,3vw,24px);letter-spacing:1px;margin-bottom:12px}
#maint-gate .mg-msg{color:#c3c7cf;font-size:15px;line-height:1.6;margin-bottom:26px}
#maint-gate .mg-form{display:flex;gap:10px;max-width:400px;margin:0 auto}
#maint-gate .mg-form input{flex:1;background:#0c0d10;border:1.5px solid var(--line);border-radius:10px;color:#fff;font-family:'Oswald',sans-serif;font-size:15px;padding:14px 16px;text-align:center}
#maint-gate .mg-form input:focus{outline:none;border-color:var(--yellow)}
#maint-gate .mg-form button{background:var(--red);color:#fff;border:none;border-radius:10px;padding:14px 26px;font-family:'Racing Sans One',cursive;font-size:15px;text-transform:uppercase;cursor:pointer;transition:.15s}
#maint-gate .mg-form button:hover{background:#e5352f;transform:translateY(-1px)}
#maint-gate .mg-err{color:#ff8a8a;font-size:13px;margin-top:12px;min-height:18px}
#maint-gate .mg-foot{color:#5f636b;font-size:11px;letter-spacing:1px;text-transform:uppercase;margin-top:30px}
/* painel site access */
.maint-status .maint-on{background:linear-gradient(180deg,rgba(210,31,31,.14),rgba(210,31,31,.03));border:1px solid rgba(210,31,31,.4);border-radius:12px;padding:14px 18px;color:#ffb3b3;font-size:14px}
.maint-status .maint-off{background:linear-gradient(180deg,rgba(46,199,122,.12),rgba(46,199,122,.02));border:1px solid rgba(46,199,122,.4);border-radius:12px;padding:14px 18px;color:#a7ecc8;font-size:14px}
.maint-status b{color:#fff}
.maint-note{margin-top:16px;font-size:12px;color:#8a8f98;line-height:1.6}
/* backup & restore */
.bk-statgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-top:12px}
.golive-box{background:linear-gradient(180deg,rgba(46,199,122,.12),rgba(46,199,122,.02));border:1px solid rgba(46,199,122,.45);border-radius:14px;padding:18px;margin-top:14px}
.golive-h{font-family:'Racing Sans One',cursive;color:#7fe0aa;font-size:17px;margin-bottom:6px}
.golive-tx{font-size:13px;color:#c3c7cf;line-height:1.6;margin-bottom:14px}
.golive-btn{background:linear-gradient(135deg,#2ec77a,#1f9e5e);color:#04220f;border:none;border-radius:10px;padding:14px 28px;font-family:'Racing Sans One',cursive;font-size:15px;letter-spacing:.5px;cursor:pointer;transition:.15s;box-shadow:0 12px 30px -10px rgba(46,199,122,.6)}
.golive-btn:hover{transform:translateY(-2px);filter:brightness(1.08)}
.bk-stat{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:2px}
.bk-stat-n{font-family:'Racing Sans One',sans-serif;color:var(--yellow);font-size:22px}
.bk-stat-l{font-size:11.5px;color:#9aa0aa}
.bk-last{margin-top:12px;font-size:12px;color:#9aa0aa}.bk-last b{color:#fff}
.bk-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:18px}
.bk-box{border:1px solid var(--line);border-radius:14px;padding:20px;text-align:center}
.bk-download{background:linear-gradient(180deg,rgba(46,199,122,.08),rgba(46,199,122,.02));border-color:rgba(46,199,122,.35)}
.bk-restore{background:linear-gradient(180deg,rgba(210,31,31,.08),rgba(210,31,31,.02));border-color:rgba(210,31,31,.35)}
.bk-box-ic{font-size:30px;margin-bottom:6px}
.bk-download .bk-box-ic{color:#2ec77a}.bk-restore .bk-box-ic{color:#ff8a8a}
.bk-box-h{font-family:Oswald,sans-serif;font-weight:600;color:#fff;font-size:16px;margin-bottom:6px}
.bk-box-tx{font-size:12.5px;color:#9aa0aa;line-height:1.5;margin-bottom:14px}
.bk-note{margin-top:16px;font-size:12px;color:#8a8f98;line-height:1.6}
/* settings panel */
#set-panel{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:14px}
#set-panel .set-card{background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:14px;padding:20px}
#set-panel .set-google{border-color:rgba(66,133,244,.3)}
#set-panel .set-insta{border-color:rgba(225,48,108,.3)}
#set-panel .set-email{border-color:rgba(46,199,122,.3);grid-column:1/-1}
#set-panel .set-pay{border-color:rgba(242,194,48,.35);grid-column:1/-1}
#set-panel .pm-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:6px;margin-top:8px}
#set-panel .pm-item{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:9px;padding:9px 12px;font-size:13px;color:#dfe2e7;cursor:pointer;transition:.12s}
#set-panel .pm-item:hover{border-color:rgba(242,194,48,.4)}
#set-panel .pm-item input{accent-color:var(--yellow)}
#set-panel .pm-item .pm-ic{font-size:14px}
#set-panel .pm-all{background:rgba(242,194,48,.1);border-color:rgba(242,194,48,.4);grid-column:1/-1}
#set-panel .pm-all b{color:var(--yellow)}
.pay-chips{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:10px}
.pay-chip{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);border-radius:20px;padding:4px 12px;font-size:11px;color:#dfe2e7;font-family:'Oswald',sans-serif}
/* busca de ordens */
#ap-orders .ord-search{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0 4px}
#ap-orders .ord-search input{flex:2;min-width:220px;background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#fff;font-family:'Oswald',sans-serif;font-size:14px;padding:11px 14px}
#ap-orders .ord-search input:focus{outline:none;border-color:var(--yellow)}
#ap-orders .ord-search select{flex:1;min-width:150px;background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#fff;font-family:'Oswald',sans-serif;font-size:13px;padding:11px 12px}
#set-panel .set-h{display:flex;align-items:center;gap:9px;margin-bottom:8px}
#set-panel .set-h b{font-family:'Oswald',sans-serif;font-size:15px;color:#fff}
#set-panel .set-desc{font-size:12.5px;color:#9aa0aa;line-height:1.55;margin-bottom:14px}
#set-panel .set-lbl{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:#bdbdbd;margin:10px 0 5px}
#set-panel .set-opt{text-transform:none;letter-spacing:0;color:#7a7f88;font-size:10px}
#set-panel .set-in{width:100%;background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#fff;font-family:'Oswald',sans-serif;font-size:14px;padding:10px 12px}
#set-panel .set-in:focus{outline:none;border-color:var(--yellow)}
#set-panel .set-row{display:flex;gap:10px}
#set-panel .set-btn{margin-top:14px;background:var(--yellow);color:#111;border:none;border-radius:9px;padding:11px 22px;font-family:'Oswald',sans-serif;font-weight:600;font-size:13px;cursor:pointer;transition:.15s}
#set-panel .set-btn:hover{filter:brightness(1.05);transform:translateY(-1px)}
#set-panel .set-msg{margin-left:10px;font-size:12px}
#set-panel .set-note{margin-top:12px;font-size:11.5px;color:#8a8f98;line-height:1.6}
#set-panel .set-steps{margin:8px 0 12px;padding-left:20px;font-size:12.5px;color:#c3c7cf;line-height:1.7}
#set-panel .set-steps li{margin-bottom:3px}
#set-panel .set-steps b{color:#8fd0ff}
/* opções de checkout (bolinhas que o admin marca) */
#set-panel .co-opts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}
#set-panel .co-opt{display:flex;align-items:flex-start;gap:10px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:11px;padding:12px;cursor:pointer;transition:.15s}
#set-panel .co-opt:hover{border-color:#2ec77a}
#set-panel .co-opt input{position:absolute;opacity:0;width:0;height:0}
#set-panel .co-opt .co-opt-dot{flex:none;width:20px;height:20px;border-radius:50%;border:2px solid rgba(255,255,255,.3);margin-top:1px;transition:.15s;position:relative}
#set-panel .co-opt input:checked ~ .co-opt-dot{border-color:#2ec77a;background:#2ec77a}
#set-panel .co-opt input:checked ~ .co-opt-dot::after{content:'✓';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#04220f;font-size:12px;font-weight:bold}
#set-panel .co-opt input:checked ~ div b{color:#2ec77a}
/* painel Payments (aba própria) */
.adm-load{display:flex;align-items:center;gap:11px;color:#9aa0aa;font:500 14px Oswald,sans-serif;padding:20px 4px}
.adm-spin{width:17px;height:17px;border:2px solid rgba(255,255,255,.18);border-top-color:var(--yellow);border-radius:50%;animation:admspin .8s linear infinite;flex:none}
@keyframes admspin{to{transform:rotate(360deg)}}
.rev-grid{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0 14px}
.rev-box{flex:1;min-width:140px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:12px;padding:11px 13px}
.rev-box span{display:block;font-size:11px;letter-spacing:.6px;text-transform:uppercase;color:#8a8f98}
.rev-box b{display:block;font:600 22px/1.2 Oswald,sans-serif;color:#fff;margin:3px 0 1px}
.rev-box small{color:#8a8f98;font-size:11.5px}
.rev-qr{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.rev-qrbox{background:#fff;border-radius:12px;padding:10px;line-height:0;flex:none}
.rev-qrbox svg{width:170px;height:170px;display:block}
.rev-qrtx{flex:1;min-width:200px}
.rev-qrtx b{display:block;color:#fff;font:600 15px Oswald,sans-serif;margin-bottom:4px}
.rev-qrtx span{color:#9aa0aa;font-size:12.5px;line-height:1.5}
.rev-pre{margin-top:14px;background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.rev-pre b{display:block;font-size:11px;letter-spacing:.6px;text-transform:uppercase;color:#8a8f98;margin-bottom:6px}
.rev-pre i{display:block;font-style:normal;color:#fff;font:600 14px Oswald,sans-serif;margin-bottom:3px}
.rev-pre span{color:#b7bcc4;font-size:13px;line-height:1.55}
.pov-msg{display:none;border-radius:10px;padding:10px 13px;margin-bottom:12px;font:500 13px/1.45 Oswald,sans-serif}
.pov-msg.ok{background:rgba(46,199,122,.12);border:1px solid rgba(46,199,122,.4);color:#8fe3b4}
.pov-msg.warn{background:rgba(226,138,11,.12);border:1px solid rgba(226,138,11,.45);color:#f0c987}
.bpu-lim{background:rgba(226,138,11,.12);border:1px solid rgba(226,138,11,.45);border-radius:10px;padding:11px 13px;margin-bottom:12px;color:#f0c987;font:500 13px/1.5 Oswald,sans-serif}
#pay-panel .pay-sec{background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:14px;padding:16px;margin-bottom:14px}
#pay-panel .pay-sec-h{margin-bottom:12px}
#pay-panel .pay-sec-h b{display:block;font-family:'Oswald',sans-serif;font-size:16px;color:var(--yellow)}
#pay-panel .pay-sec-h span{display:block;color:#9aa0aa;font-size:12px;margin-top:2px;line-height:1.4}
#pay-panel .co-opts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
#pay-panel .co-opt{display:flex;align-items:flex-start;gap:10px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:11px;padding:12px;cursor:pointer;transition:.15s;position:relative}
#pay-panel .co-opt:hover{border-color:#2ec77a}
#pay-panel .co-opt input{position:absolute;opacity:0;width:0;height:0}
#pay-panel .co-opt .co-opt-dot{flex:none;width:20px;height:20px;border-radius:50%;border:2px solid rgba(255,255,255,.3);margin-top:1px;transition:.15s;position:relative}
#pay-panel .co-opt input:checked ~ .co-opt-dot{border-color:#2ec77a;background:#2ec77a}
#pay-panel .co-opt input:checked ~ .co-opt-dot::after{content:'✓';position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#04220f;font-size:12px;font-weight:bold}
#pay-panel .co-opt input:checked ~ div b{color:#2ec77a}
#pay-panel .co-opt b{display:block;font-size:13px;color:#fff;font-family:'Oswald',sans-serif}
#pay-panel .co-opt small{display:block;color:#9aa0aa;font-size:11px;line-height:1.4;margin-top:2px}
#pay-panel .pay-preview{background:rgba(46,199,122,.08);border:1px solid rgba(46,199,122,.3);border-radius:10px;padding:10px 12px;margin-bottom:12px;font-size:13px;color:#c3c7cf;font-family:'Oswald',sans-serif}
#pay-panel .pay-preview b{color:#fff}
/* painel Company + Cloud (reusa o estilo do pay-panel) */
#company-panel .pay-sec,#cloud-panel .pay-sec{background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:14px;padding:16px;margin-bottom:14px}
#company-panel .pay-sec-h,#cloud-panel .pay-sec-h{margin-bottom:12px}
#company-panel .pay-sec-h b,#cloud-panel .pay-sec-h b{display:block;font-family:'Oswald',sans-serif;font-size:16px;color:var(--yellow)}
#company-panel .pay-sec-h span,#cloud-panel .pay-sec-h span{display:block;color:#9aa0aa;font-size:12px;margin-top:2px;line-height:1.4}
#company-panel .set-lbl,#cloud-panel .set-lbl{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:#bdbdbd;margin:12px 0 6px}
#company-panel .set-opt,#cloud-panel .set-opt{text-transform:none;letter-spacing:0;color:#7a7f88;font-size:10.5px}
#company-panel .set-in,#cloud-panel .set-in{width:100%;background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#fff;font-family:'Oswald',sans-serif;font-size:14px;padding:11px 12px;box-sizing:border-box}
#company-panel .set-in:focus,#cloud-panel .set-in:focus{outline:none;border-color:var(--yellow)}
#company-panel textarea.set-in,#cloud-panel textarea.set-in{resize:vertical;min-height:80px;font-family:'Oswald',sans-serif}
#company-panel .set-row,#cloud-panel .set-row{display:flex;gap:12px;flex-wrap:wrap}
#company-panel .set-row>div{flex:1;min-width:140px}
#company-panel .set-btn,#cloud-panel .set-btn{margin-top:16px;background:var(--yellow);color:#111;border:none;border-radius:10px;padding:12px 24px;font-family:'Oswald',sans-serif;font-weight:600;font-size:14px;cursor:pointer;transition:.15s}
#company-panel .set-btn:hover,#cloud-panel .set-btn:hover{filter:brightness(1.08)}
#company-panel .set-msg{margin-left:10px;font-size:13px;font-family:'Oswald',sans-serif}
#company-panel .cmp-preview{background:rgba(46,199,122,.06);border:1px solid rgba(46,199,122,.25);border-radius:10px;padding:12px 14px;font-size:13px;color:#c3c7cf;font-family:'Oswald',sans-serif}
#company-panel .cmp-preview b{color:var(--yellow)}
#cloud-panel .cloud-steps{display:flex;flex-direction:column;gap:10px}
#cloud-panel .cloud-step{display:flex;gap:12px;align-items:flex-start;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:11px;padding:12px}
#cloud-panel .cloud-n{flex:none;width:26px;height:26px;border-radius:50%;background:var(--yellow);color:#111;font-weight:bold;display:flex;align-items:center;justify-content:center;font-family:'Oswald',sans-serif}
#cloud-panel .cloud-step b{display:block;color:#fff;font-family:'Oswald',sans-serif;font-size:14px}
#cloud-panel .cloud-step small{display:block;color:#9aa0aa;font-size:12px;line-height:1.4;margin-top:2px}
@media(max-width:640px){#company-panel .set-row,#cloud-panel .set-row{flex-direction:column;gap:0}#company-panel .set-row>div{min-width:0}}
/* painel Partners */
#partners-admin .pn-card{background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:14px;padding:16px;margin-bottom:12px}
#partners-admin .set-lbl{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:#bdbdbd;margin:10px 0 5px}
#partners-admin .set-opt{text-transform:none;letter-spacing:0;color:#7a7f88;font-size:10.5px}
#partners-admin .set-in{width:100%;background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#fff;font-family:'Oswald',sans-serif;font-size:14px;padding:10px 12px;box-sizing:border-box}
#partners-admin .set-in:focus{outline:none;border-color:var(--yellow)}
#partners-admin textarea.set-in{resize:vertical;min-height:56px}
#partners-admin .pn-row{display:flex;gap:12px;flex-wrap:wrap}
#partners-admin .pn-row>div{flex:1;min-width:120px}
#partners-admin .pn-del{background:rgba(210,31,31,.15);border:1px solid rgba(210,31,31,.4);color:#ff6b6b;border-radius:9px;padding:10px 14px;font-family:'Oswald',sans-serif;font-size:13px;cursor:pointer;height:fit-content}
#partners-admin .set-btn{background:var(--yellow);color:#111;border:none;border-radius:10px;padding:12px 24px;font-family:'Oswald',sans-serif;font-weight:600;font-size:14px;cursor:pointer}
/* painel Media */
#media-admin .media-slot{background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:14px;padding:16px;margin-bottom:12px}
/* filtro por seção */
#media-admin .media-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
#media-admin .media-tab{background:rgba(255,255,255,.04);border:1px solid var(--line);color:#c3c7cf;border-radius:20px;padding:8px 18px;font-family:'Oswald',sans-serif;font-size:13px;cursor:pointer;transition:.15s}
#media-admin .media-tab.on{background:var(--yellow);color:#111;border-color:var(--yellow);font-weight:600}
#media-admin .media-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
#media-admin .media-info{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 10px}
#media-admin .media-sz{background:rgba(255,255,255,.05);border:1px solid var(--line);color:#c3c7cf;font-size:11.5px;padding:4px 10px;border-radius:8px;font-family:'Oswald',sans-serif}
#media-admin .media-max{background:rgba(46,199,122,.1);border:1px solid rgba(46,199,122,.3);color:#4ade80;font-size:11.5px;padding:4px 10px;border-radius:8px;font-family:'Oswald',sans-serif}
/* upload direto no slot + som */
#media-admin .media-slot-row{display:flex;gap:8px;align-items:stretch}
#media-admin .media-slot-row .media-sel{flex:1}
#media-admin .media-up{flex:none;width:44px;background:var(--yellow);color:#111;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:bold;cursor:pointer;transition:.12s}
#media-admin .media-up:hover{filter:brightness(1.1)}
#media-admin .media-sound{display:flex;gap:8px;margin-top:8px;align-items:stretch}
#media-admin .media-sndbtn{flex:none;background:rgba(255,255,255,.05);border:1px solid var(--line);color:#c3c7cf;border-radius:9px;padding:8px 12px;font-family:'Oswald',sans-serif;font-size:12.5px;cursor:pointer;white-space:nowrap}
#media-admin .media-sndbtn.on{background:rgba(46,199,122,.15);border-color:rgba(46,199,122,.4);color:#4ade80}
#media-admin .media-track{flex:1;background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#fff;font-family:'Oswald',sans-serif;font-size:12.5px;padding:8px 10px}
/* botão browse + seletor visual */
#media-admin .media-browse{flex:1;background:rgba(255,255,255,.05);border:1px solid var(--line);color:#fff;border-radius:9px;padding:10px 12px;font-family:'Oswald',sans-serif;font-size:13px;cursor:pointer;transition:.12s}
#media-admin .media-browse:hover{border-color:var(--yellow);background:rgba(242,194,48,.1)}
.mp-ov{position:fixed;inset:0;z-index:10150;background:rgba(0,0,0,.82);backdrop-filter:blur(4px);display:none;align-items:center;justify-content:center;padding:24px}
.mp-ov.on{display:flex}
.mp-box{background:#0e0e11;border:1px solid rgba(255,255,255,.14);border-radius:16px;width:100%;max-width:1150px;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 24px 60px -12px rgba(0,0,0,.8)}
.mp-h{display:flex;justify-content:space-between;align-items:center;padding:16px 18px;border-bottom:1px solid rgba(255,255,255,.1)}
.mp-h b{font-family:'Oswald',sans-serif;font-size:16px;color:var(--yellow)}
.mp-x{background:rgba(255,255,255,.06);border:none;color:#c3c7cf;font-size:24px;width:34px;height:34px;border-radius:9px;cursor:pointer}
.mp-search{margin:14px 18px 0;background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:10px;color:#fff;font-family:'Oswald',sans-serif;font-size:14px;padding:11px 14px}
.mp-search:focus{outline:none;border-color:var(--yellow)}
.mp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));grid-auto-rows:230px;gap:16px;padding:18px;overflow-y:auto;align-content:start}
.mp-card{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:14px;overflow:hidden;cursor:pointer;transition:.14s;display:flex;flex-direction:column}
.mp-card:hover{border-color:var(--yellow);transform:translateY(-3px);box-shadow:0 10px 28px -8px rgba(0,0,0,.6)}
.mp-card.sel{border-color:#2ec77a;box-shadow:0 0 0 2px rgba(46,199,122,.3)}
.mp-thumb{position:relative;height:180px;min-height:180px;flex:0 0 180px;background:#000;overflow:hidden}
.mp-thumb video{width:100%;height:100%;object-fit:cover;display:block}
.mp-thumb img{width:100%;height:100%;object-fit:contain;display:block;background:#0a0b0d;padding:6px}
.mp-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:64px;height:64px;border-radius:50%;background:rgba(0,0,0,.55);border:2.5px solid #fff;color:#fff;font-size:22px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.12s}
.mp-play:hover{background:var(--yellow);color:#111;border-color:var(--yellow);transform:translate(-50%,-50%) scale(1.08)}
.mp-cur{position:absolute;top:8px;left:8px;background:#2ec77a;color:#04220f;font-size:12px;padding:3px 10px;border-radius:12px;font-weight:bold;font-family:'Oswald',sans-serif}
.mp-type{position:absolute;top:8px;right:8px;font-size:10.5px;padding:3px 9px;border-radius:10px;font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:.5px}
.mp-type.vid{background:rgba(242,194,48,.9);color:#111}
.mp-type.img{background:rgba(0,0,0,.6);color:#c3c7cf;border:1px solid rgba(255,255,255,.2)}
.mp-name{padding:12px 14px;font-size:14px;color:#fff;font-family:'Oswald',sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mp-thumbname{position:absolute;left:0;right:0;bottom:0;padding:16px 12px 8px;background:linear-gradient(transparent,rgba(0,0,0,.9));color:#fff;font-family:'Oswald',sans-serif;font-size:12.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none;text-shadow:0 1px 3px #000}
@media(max-width:760px){.mp-grid{grid-template-columns:1fr;gap:12px}}
@media(max-width:900px){#media-admin .media-grid{grid-template-columns:1fr}}
/* subcategorias (Site slots / Gallery) */
#media-admin .media-maintabs{display:flex;gap:8px;margin-bottom:16px;border-bottom:1px solid var(--line);padding-bottom:12px}
#media-admin .media-mtab{background:rgba(255,255,255,.04);border:1px solid var(--line);color:#c3c7cf;border-radius:10px;padding:10px 18px;font-family:'Oswald',sans-serif;font-size:14px;cursor:pointer;transition:.15s}
#media-admin .media-mtab.on{background:var(--yellow);color:#111;border-color:var(--yellow);font-weight:600}
/* galeria */
#media-admin .gal-wrap{display:grid;grid-template-columns:220px 1fr;gap:16px}
#media-admin .gal-folders{display:flex;flex-direction:column;gap:6px}
#media-admin .gal-folders-h{color:#9aa0aa;font-size:11px;text-transform:uppercase;letter-spacing:1px;margin-bottom:4px}
#media-admin .gal-folder{display:flex;align-items:center;gap:6px;background:rgba(255,255,255,.03);border:1px solid var(--line);color:#dfe2e7;border-radius:10px;padding:10px 12px;font-family:'Oswald',sans-serif;font-size:13.5px;cursor:pointer;text-align:left}
#media-admin .gal-folder.on{background:rgba(242,194,48,.12);border-color:var(--yellow);color:#fff}
#media-admin .gal-count{margin-left:auto;background:rgba(255,255,255,.1);border-radius:10px;padding:1px 8px;font-size:11px}
#media-admin .gal-newfolder{display:flex;align-items:center;justify-content:center;gap:7px;background:rgba(255,255,255,.04);border:1px dashed rgba(255,255,255,.25);color:#c3c7cf;border-radius:10px;padding:11px;font-family:'Oswald',sans-serif;font-size:13px;cursor:pointer;margin-top:8px;transition:.15s}
#media-admin .gal-newfolder:hover{border-color:var(--yellow);color:var(--yellow)}
#media-admin .gal-main{min-width:0}
#media-admin .gal-empty{color:#9aa0aa;font-size:13.5px;line-height:1.6;padding:30px 16px;text-align:center;background:rgba(255,255,255,.02);border:1px dashed var(--line);border-radius:12px}
#media-admin .gal-main-h{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:12px}
#media-admin .gal-main-h b{font-family:'Oswald',sans-serif;font-size:17px;color:var(--yellow)}
#media-admin .gal-main-actions{display:flex;gap:8px}
#media-admin .gal-main-actions button{background:rgba(255,255,255,.06);border:1px solid var(--line);color:#c3c7cf;border-radius:8px;padding:7px 14px;font-family:'Oswald',sans-serif;font-size:12.5px;cursor:pointer}
#media-admin .gal-main-actions .gal-del{background:rgba(210,31,31,.15);border-color:rgba(210,31,31,.4);color:#ff6b6b}
#media-admin .gal-add{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}
#media-admin .gal-up{background:var(--yellow);color:#111;border-radius:10px;padding:11px 18px;font-family:'Oswald',sans-serif;font-weight:600;font-size:13.5px;cursor:pointer}
#media-admin .gal-addlib{flex:1;min-width:180px;background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#fff;font-family:'Oswald',sans-serif;font-size:13.5px;padding:10px 12px}
#media-admin .gal-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}
#media-admin .gal-item{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:12px;overflow:hidden;position:relative;transition:.14s}
#media-admin .gal-item:hover{border-color:var(--yellow);transform:translateY(-2px)}
#media-admin .gal-item img,#media-admin .gal-item video{width:100%;aspect-ratio:1/1;object-fit:contain;display:block;background:#0a0b0d;padding:6px}
#media-admin .gal-nofile{width:100%;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;color:#7a7f88;font-size:12px;background:rgba(255,255,255,.02)}
#media-admin .gal-item-b{padding:10px 12px;border-top:1px solid rgba(255,255,255,.06)}
#media-admin .gal-item-b b{display:block;font-size:13.5px;color:#fff;font-family:'Oswald',sans-serif;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#media-admin .gal-item-b small{color:#e6a417;font-size:10.5px}
#media-admin .gal-item-x{position:absolute;top:6px;right:6px;background:rgba(0,0,0,.6);border:none;color:#fff;width:24px;height:24px;border-radius:6px;cursor:pointer;font-size:16px}
@media(max-width:640px){#media-admin .gal-wrap{grid-template-columns:1fr}}
/* galeria nova: auto libraries, busca, ações por item */
#media-admin .gal-biggroup{color:#9aa0aa;font-size:12.5px;padding:8px 12px;background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:9px;margin-bottom:5px}
#media-admin .gal-search{margin-bottom:12px}
#media-admin .gal-item-acts{position:absolute;top:6px;right:6px;display:flex;gap:4px}
#media-admin .gal-item-acts button{background:rgba(0,0,0,.65);border:none;color:#fff;width:26px;height:26px;border-radius:6px;cursor:pointer;font-size:13px;display:flex;align-items:center;justify-content:center}
#media-admin .gal-item-acts button:hover{background:var(--yellow);color:#111}
#media-admin .gal-audio{width:100%;aspect-ratio:16/10;display:flex;align-items:center;justify-content:center;font-size:30px;background:rgba(242,194,48,.08)}
/* ===== SECTIONS admin ===== */
#sections-admin .sec-summary{background:rgba(46,199,122,.08);border:1px solid rgba(46,199,122,.3);border-radius:10px;padding:10px 14px;font-size:13px;color:#c3c7cf;font-family:'Oswald',sans-serif;margin-bottom:14px}
#sections-admin .sec-summary b{color:#4ade80;font-size:16px}
#sections-admin .sec-list{display:flex;flex-direction:column;gap:8px}
#sections-admin .sec-addbtn{display:inline-flex;align-items:center;gap:9px;margin-top:16px;background:var(--yellow);color:#111;border:none;border-radius:11px;padding:12px 22px;font-family:'Oswald',sans-serif;font-weight:600;font-size:14px;letter-spacing:.3px;cursor:pointer;transition:.15s;box-shadow:0 4px 14px -4px rgba(242,194,48,.4)}
#sections-admin .sec-addbtn:hover{filter:brightness(1.06);transform:translateY(-1px);box-shadow:0 6px 18px -4px rgba(242,194,48,.5)}
#sections-admin .sec-addbtn svg{stroke:#111}
#sections-admin .sec-row{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:11px;padding:10px 12px;transition:.12s}
.sec-vis{background:rgba(255,255,255,.05);border:1px solid var(--line);color:#c3c7cf;border-radius:8px;padding:6px 10px;font-family:'Oswald',sans-serif;font-size:11px;letter-spacing:.4px;cursor:pointer;white-space:nowrap;transition:.12s}
.sec-vis:hover{border-color:var(--yellow);color:#fff}
.sec-vis.restricted{background:rgba(242,194,48,.14);border-color:rgba(242,194,48,.5);color:var(--yellow)}
.sec-visbox{background:#111318;border:1px solid #2a2e36;border-radius:14px;width:min(92vw,460px);max-height:82vh;overflow:auto;padding:18px}
.sec-vismodes{display:flex;gap:8px;margin:14px 0}
.sec-vmode{flex:1;background:rgba(255,255,255,.04);border:1px solid var(--line);color:#c3c7cf;border-radius:10px;padding:11px 8px;font-family:'Oswald',sans-serif;font-size:12px;cursor:pointer;transition:.12s}
.sec-vmode.on{background:var(--yellow);color:#111;border-color:var(--yellow);font-weight:600}
.sec-uhint{color:#9aa0aa;font-size:12px;line-height:1.5;margin:6px 0 12px}
.sec-ulist{display:flex;flex-direction:column;gap:6px}
.sec-uitem{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:9px;padding:9px 11px;cursor:pointer;transition:.1s}
.sec-uitem:hover{border-color:rgba(242,194,48,.4)}
.sec-uitem.on{background:rgba(242,194,48,.1);border-color:rgba(242,194,48,.45)}
.sec-uitem input{width:17px;height:17px;accent-color:#F2C230;cursor:pointer}
.sec-uname{display:flex;flex-direction:column;font-family:'Oswald',sans-serif;color:#fff;font-size:13.5px;line-height:1.3}
.sec-uname em{font-style:normal;color:#7f8794;font-size:11.5px}
.sec-uadm{color:#F2C230;font-size:10px;text-transform:uppercase}
.sec-unone{color:#9aa0aa;font-size:13px;padding:16px;text-align:center;background:rgba(255,255,255,.02);border-radius:10px}
#sections-admin .sec-row.off{opacity:.5}
#sections-admin .sec-row.dragging{opacity:.4;border-color:var(--yellow)}
#sections-admin .sec-drag{cursor:grab;color:#6a6f78;letter-spacing:-3px;font-size:16px;user-select:none;flex:none}
#sections-admin .sec-ico{flex:none;width:42px;height:42px;background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:10px;color:var(--yellow);cursor:pointer;padding:8px;transition:.12s}
#sections-admin .sec-ico:hover{border-color:var(--yellow)}
#sections-admin .sec-ico svg{width:100%;height:100%}
#sections-admin .sec-name{flex:1;min-width:0;background:#0c0d10;border:1px solid rgba(255,255,255,.14);border-radius:8px;color:#fff;font-family:'Oswald',sans-serif;font-size:14px;padding:9px 12px}
#sections-admin .sec-name:focus{outline:none;border-color:var(--yellow)}
#sections-admin .sec-badge{background:#2ec77a;color:#04220f;font-size:10px;padding:2px 8px;border-radius:10px;font-weight:bold;flex:none}
#sections-admin .sec-toggle{position:relative;width:44px;height:24px;flex:none;cursor:pointer}
#sections-admin .sec-toggle input{opacity:0;width:0;height:0;position:absolute}
#sections-admin .sec-toggle span{position:absolute;inset:0;background:rgba(255,255,255,.15);border-radius:20px;transition:.2s}
#sections-admin .sec-toggle span::before{content:'';position:absolute;width:18px;height:18px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s}
#sections-admin .sec-toggle input:checked+span{background:#2ec77a}
#sections-admin .sec-toggle input:checked+span::before{transform:translateX(20px)}
#sections-admin .sec-del{flex:none;background:rgba(210,31,31,.12);border:1px solid rgba(210,31,31,.35);color:#ff6b6b;border-radius:8px;width:36px;height:36px;cursor:pointer;font-size:15px}
#sections-admin .sec-del:hover{background:var(--red);color:#fff}
/* seletor de ícones */
#sections-admin .sec-iconov{position:fixed;inset:0;z-index:10140;background:rgba(0,0,0,.7);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:20px}
#sections-admin .sec-iconbox{background:#101013;border:1px solid rgba(255,255,255,.14);border-radius:16px;width:100%;max-width:440px;padding:18px}
#sections-admin .sec-iconh{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
#sections-admin .sec-iconh b{font-family:'Oswald',sans-serif;font-size:16px;color:var(--yellow)}
#sections-admin .sec-iconh button{background:rgba(255,255,255,.06);border:none;color:#c3c7cf;font-size:22px;width:32px;height:32px;border-radius:8px;cursor:pointer}
#sections-admin .sec-icongrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(56px,1fr));gap:8px;max-height:60vh;overflow-y:auto}
#sections-admin .sec-iconopt{background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:10px;color:var(--yellow);cursor:pointer;padding:10px;aspect-ratio:1;transition:.12s}
#sections-admin .sec-iconopt:hover{border-color:var(--yellow);background:rgba(242,194,48,.12);transform:scale(1.05)}
#sections-admin .sec-iconopt svg{width:100%;height:100%}
@media(max-width:640px){#sections-admin .sec-name{font-size:13px}#sections-admin .sec-badge{display:none}}
#media-admin .media-slot-h{margin-bottom:10px}
#media-admin .media-slot-h b{display:block;font-family:'Oswald',sans-serif;font-size:15px;color:var(--yellow)}
#media-admin .media-slot-h span{display:block;color:#9aa0aa;font-size:12px;margin-top:2px}
#media-admin .set-in{width:100%;background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#fff;font-family:'Oswald',sans-serif;font-size:14px;padding:10px 12px;box-sizing:border-box}
#media-admin .media-preview{display:block;width:100%;max-width:380px;height:214px;object-fit:contain;border-radius:10px;margin-top:10px;background:#0a0b0d;border:1px solid var(--line)}
#media-admin .set-btn{background:var(--yellow);color:#111;border:none;border-radius:10px;padding:12px 24px;font-family:'Oswald',sans-serif;font-weight:600;font-size:14px;cursor:pointer}
#media-admin .set-msg{margin-left:10px;font-size:13px;font-family:'Oswald',sans-serif}
/* localização do parceiro no site */
.partner-loc{color:#9aa0aa;font-size:12px;margin:2px 0 6px}
/* ===== BLACKLIST MAP (seção do site) ===== */
.blmap-setup{background:rgba(242,194,48,.1);border:1px solid rgba(242,194,48,.4);color:#e6c14e;border-radius:12px;padding:12px 16px;font-size:13px;margin-bottom:14px;line-height:1.5}
.blmap-grid{display:grid;grid-template-columns:250px 1fr 300px;gap:12px;height:600px}
/* ===== mapa LIMPO: abas em cima, botoes embaixo, tudo FORA do mapa ===== */
.blmap-center{display:flex;flex-direction:column;gap:10px;min-width:0;min-height:0}
.blmap-center>.blmap-map{flex:1 1 auto;min-height:0}
.blmap-center>.blmap-layers{position:static !important;top:auto !important;left:auto !important;right:auto !important;bottom:auto !important;width:auto !important;z-index:auto !important;display:flex;flex-wrap:wrap;gap:7px;overflow:visible;padding:9px 10px;background:rgba(16,17,20,.6);border:1px solid var(--line);border-radius:12px;justify-content:center}
.blmap-center>.blmap-acts{position:static !important;left:auto !important;bottom:auto !important;top:auto !important;right:auto !important;max-width:100% !important;z-index:auto !important;display:flex;flex-wrap:wrap;gap:7px;justify-content:center;padding:9px 10px;background:rgba(16,17,20,.6);border:1px solid var(--line);border-radius:12px}
/* chat/eventos colapsavel (barra lateral com menuzinho que abre) */
.blmap-chattog{width:100%;background:rgba(242,194,48,.12);border:1px solid rgba(242,194,48,.4);color:var(--yellow);border-radius:10px;padding:10px;font-family:'Oswald',sans-serif;font-weight:600;font-size:12px;letter-spacing:1.5px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;text-transform:uppercase}
.blmap-chattog:hover{background:rgba(242,194,48,.22)}
@media(min-width:1001px){
  .blmap-grid.chat-min{grid-template-columns:250px 1fr 48px}
  .blmap-grid.chat-min .blmap-chat{overflow:visible !important;background:none !important;border:none !important}
  .blmap-grid.chat-min .blmap-chat>*:not(.blmap-chattog){display:none !important}
  .blmap-grid.chat-min .blmap-chattog{writing-mode:vertical-rl;transform:rotate(180deg);height:100%;width:48px;margin:0;border-radius:12px;letter-spacing:2px}
  .blmap-grid:not(.chat-min) .blmap-chattog{margin-bottom:8px}
}
@media(pointer:coarse){ .blmap-chattog{display:none} .blmap-grid.chat-min .blmap-chat>*{display:block !important} }
@media(max-width:1000px){.blmap-grid{grid-template-columns:1fr;height:auto}.blmap-side,.blmap-chat{max-height:340px}}
.blmap-side,.blmap-chat{background:rgba(16,17,20,.6);border:1px solid var(--line);border-radius:14px;overflow-y:auto}
.blmap-sh{padding:11px 14px;font-family:'Racing Sans One',sans-serif;font-size:14px;color:var(--yellow);letter-spacing:1px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between}
.blmap-sh span{font-family:'Oswald';font-size:10.5px;color:#9aa0aa;letter-spacing:0;text-transform:uppercase}
.blmap-racer{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid rgba(255,255,255,.04)}
.blmap-tag{flex:none;min-width:44px;height:38px;padding:0 7px;border-radius:8px;background:linear-gradient(135deg,#1c1e26,#0d0e12);border:1.5px solid var(--yellow);display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;transform:skewX(-7deg)}
.blmap-tag.rd{border-color:var(--red)}.blmap-tag.rd .s{color:#ff6b6b}
.blmap-tag .blmap-ic{color:var(--yellow)}.blmap-tag .s{font-size:14px;color:var(--yellow)}.blmap-tag .t{font-family:'Permanent Marker',cursive;font-size:9px;color:#fff;white-space:nowrap}
.blmap-tag .o{position:absolute;bottom:-3px;right:-3px;width:10px;height:10px;border-radius:50%;background:#2ec77a;border:2px solid #0a0b0d}
.blmap-tag .o.race{background:var(--red)}.blmap-tag .o.busy{background:var(--yellow)}
.blmap-racer .nm{font-weight:600;font-size:13px}.blmap-racer .cr{font-size:10.5px;color:#9aa0aa}
.blmap-racer .rt{margin-left:auto;font-size:9px;padding:3px 6px;border-radius:8px;font-weight:600}
.blmap-racer .rt.on{background:rgba(46,199,122,.14);color:#4ade80}.blmap-racer .rt.race{background:rgba(210,31,31,.16);color:#ff6b6b}.blmap-racer .rt.busy{background:rgba(242,194,48,.14);color:var(--yellow)}
.blmap-map{position:relative;overflow:hidden;border-radius:14px;background:radial-gradient(ellipse at 50% 40%,#12161d,#080809 72%);border:1px solid var(--line);min-height:360px}
/* ===== MAPA no MOBILE/TABLET: mapa limpo (altura fixa) em cima; cards e botões movidos (via JS) pra baixo, empilhados ===== */
@media(pointer:coarse){
  #blmap-host .blmap-map{height:clamp(320px,56vh,460px) !important;min-height:0 !important;overflow:hidden !important}
  #blmap-host .blmap-map .mp-label{font-size:9px !important}
  /* chips de filtro na BORDA DE BAIXO do quadro (não sobrepõem o mapa) */
  #blmap-host .blmap-layers{top:auto !important;bottom:8px !important;left:8px !important;right:8px !important;width:auto !important;z-index:24}
  /* zoom vai pro topo-direita (não conflita com os chips embaixo) */
  #blmap-host .blmap-zoom{top:8px !important;right:8px !important;bottom:auto !important;left:auto !important}
  #blmap-host .blmap-pin,#blmap-host .blmap-radar,#blmap-host .mp-blip{display:none !important}
  /* os cards/botões movidos pra fora do mapa (viram irmãos com esta classe) */
  .blmap-below{display:flex;flex-direction:column;gap:10px;margin-top:12px}
  .blmap-below .blmap-navbar,.blmap-below .blmap-alert{position:static !important;transform:none !important;width:100% !important;max-width:100% !important;left:auto !important;top:auto !important;margin:0 !important}
  .blmap-below .blmap-acts{position:static !important;width:100% !important;left:auto !important;bottom:auto !important;margin:2px 0 0 !important;display:flex !important;flex-wrap:wrap;gap:8px;justify-content:center}
  .blmap-below .blmap-acts button{flex:0 0 auto}
  .blmap-below .blmap-voice{position:static !important;margin:0 !important}
}
.blmap-gmap{position:absolute;inset:0;z-index:1;border-radius:14px}
/* ===== interface enxuta do mapa (v2) ===== */
#blmap-host .blmap-grid{display:block!important;position:relative;height:calc(100vh - 210px);min-height:520px;max-height:860px;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.08);background:#0a0d12}
#blmap-host .blmap-center{position:absolute!important;inset:0;display:block!important;padding:0!important;gap:0!important}
#blmap-host .blmap-map{position:absolute!important;inset:0;height:100%!important;max-height:none!important;min-height:0!important;border-radius:0!important;margin:0!important}
#blmap-host .blmap-gmap{border-radius:0}
/* painel da esquerda e chat viram gavetas */
#blmap-host .blmap-side,#blmap-host .blmap-chat{position:absolute!important;top:0!important;bottom:0!important;z-index:34!important;width:310px;max-width:86vw;overflow:auto;background:rgba(11,13,17,.94);backdrop-filter:blur(10px);transition:transform .24s cubic-bezier(.4,0,.2,1);padding:12px 12px 16px}
#blmap-host .blmap-side{left:0!important;right:auto!important;transform:translateX(-101%)!important;border-right:1px solid rgba(255,255,255,.09)}
#blmap-host .blmap-chat{right:0!important;left:auto!important;transform:translateX(101%)!important;border-left:1px solid rgba(255,255,255,.09);padding:0}
#blmap-host .blmap-grid.side-on .blmap-side{transform:none!important}
#blmap-host .blmap-grid.chat-on .blmap-chat{transform:none!important}
#blmap-host .blmap-chattog{display:none!important}
#blmap-host .blmap-ctabs{position:sticky;top:0;z-index:2}
/* botoes flutuantes de abrir/fechar */
.blm-tog{position:absolute;z-index:36;display:inline-flex;align-items:center;gap:7px;background:rgba(10,12,16,.86);border:1px solid rgba(255,255,255,.14);color:#e7eaee;border-radius:11px;padding:9px 12px;cursor:pointer;font:600 11.5px/1 Inter,system-ui,sans-serif;backdrop-filter:blur(8px);transition:.15s;white-space:nowrap}
.blm-tog:hover{background:rgba(26,30,37,.95);border-color:rgba(242,194,48,.5)}
.blm-tog svg{width:15px;height:15px}
.blm-tog.l{left:12px;top:12px}
.blm-tog.r{right:12px;top:12px}
.blm-tog b{color:var(--yellow,#F2C230);font-weight:700}
#blmap-host .blmap-grid.side-on .blm-tog.l{left:322px}
#blmap-host .blmap-grid.chat-on .blm-tog.r{right:322px}
/* barra de camadas compacta, so icones */
#blmap-host .blmap-layers{position:absolute!important;left:50%!important;right:auto!important;top:12px!important;bottom:auto!important;transform:translateX(-50%)!important;z-index:35!important;display:flex;flex-wrap:nowrap!important;gap:3px;background:rgba(10,12,16,.9);border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:4px;backdrop-filter:blur(10px);margin:0!important;width:auto!important;max-width:calc(100% - 290px);overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
#blmap-host .blmap-layers::-webkit-scrollbar{display:none}
#blmap-host .blmap-lyr{display:inline-flex!important;align-items:center;gap:7px;height:36px;padding:0 13px 0 10px!important;border-radius:999px!important;border:1px solid transparent!important;background:transparent!important;color:#8b929c!important;font:600 12px/1 Inter,system-ui,sans-serif!important;letter-spacing:.01em;white-space:nowrap;transition:.15s;cursor:pointer}
#blmap-host .blmap-lyr .blmap-ic{display:inline-flex;align-items:center;justify-content:center;width:17px;height:17px}
#blmap-host .blmap-lyr svg{width:17px;height:17px}
#blmap-host .blmap-lyr:hover{background:rgba(255,255,255,.07)!important;color:#fff!important}
#blmap-host .blmap-lyr.on{background:rgba(255,255,255,.06)!important;border-color:rgba(255,255,255,.14)!important;color:#fff!important}
/* cada camada com a cor do seu pino no mapa - da pra saber o que e so de bater o olho */
#blmap-host .blmap-lyr.on[data-layer="racers"]{background:rgba(46,199,122,.16)!important;border-color:rgba(46,199,122,.5)!important;color:#7fe0a8!important}
#blmap-host .blmap-lyr.on[data-layer="radar"]{background:rgba(255,157,60,.16)!important;border-color:rgba(255,157,60,.55)!important;color:#ffc089!important}
#blmap-host .blmap-lyr.on[data-layer="garage"]{background:rgba(88,166,255,.16)!important;border-color:rgba(88,166,255,.5)!important;color:#9ecbff!important}
#blmap-host .blmap-lyr.on[data-layer="partner"]{background:rgba(242,194,48,.16)!important;border-color:rgba(242,194,48,.5)!important;color:#F2C230!important}
#blmap-host .blmap-lyr.on[data-layer="event"]{background:rgba(196,160,255,.16)!important;border-color:rgba(196,160,255,.5)!important;color:#d6c2ff!important}
#blmap-host .blmap-lyr.on[data-layer="police"]{background:rgba(150,140,255,.18)!important;border-color:rgba(150,140,255,.55)!important;color:#c3bcff!important}
#blmap-host .blmap-lyr:not(.on){opacity:.42}
#blmap-host .blmap-lyr:not(.on) .blmap-ic{opacity:.7}
#blmap-host .blmap-lyr{position:relative}
#blmap-host .blmap-acts{position:absolute!important;left:50%!important;right:auto!important;top:auto!important;bottom:14px!important;transform:translateX(-50%)!important;z-index:35!important;display:flex!important;gap:6px;background:rgba(10,12,16,.88);border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:6px;backdrop-filter:blur(10px);margin:0!important;flex-wrap:nowrap!important;max-width:calc(100% - 24px)}
#blmap-host .blmap-acts button{border:0!important;background:rgba(255,255,255,.06)!important;color:#dfe3e8!important;border-radius:10px!important;padding:9px 13px!important;font:600 11.5px/1 Inter,system-ui,sans-serif!important;display:inline-flex;align-items:center;gap:6px;cursor:pointer;transition:.15s;white-space:nowrap}
#blmap-host .blmap-acts button:hover{background:rgba(255,255,255,.13)!important;color:#fff!important}
#blmap-host .blmap-acts button.a-rad{background:rgba(255,120,60,.16)!important;color:#ffb18a!important}
#blmap-host .blmap-acts button.a-tej{background:rgba(242,194,48,.18)!important;color:var(--yellow,#F2C230)!important}
#blmap-host .blmap-acts .blm-more{background:rgba(255,255,255,.06)!important;width:38px;justify-content:center;padding:9px 0!important}
#blmap-host .blmap-acts .blm-hid{display:none}
#blmap-host .blmap-grid.more-on .blmap-acts .blm-hid{display:inline-flex}
#blmap-host .blmap-zoom{position:absolute!important;right:12px!important;bottom:14px!important;top:auto!important;left:auto!important;z-index:35!important;display:flex;flex-direction:column;gap:5px}
#blmap-host .blmap-zoom button{width:38px;height:38px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:rgba(10,12,16,.88);color:#e7eaee;cursor:pointer;font-size:15px;backdrop-filter:blur(8px)}
#blmap-host .blmap-zoom button:hover{border-color:rgba(242,194,48,.5);color:var(--yellow,#F2C230)}
#blmap-host .blmap-gmap-badge{left:auto;right:12px;top:12px}
/* ===== MAPA NO CELULAR/TABLET =====
   A barra de camadas tinha "max-width: calc(100% - 290px)": numa tela de 390px
   sobravam 100px e os botoes saiam cortados. Agora ela ocupa a largura toda,
   logo abaixo dos controles de cima, e rola de lado. */
@media (max-width:900px){
  #blmap-host .blmap-layers{
    left:8px!important; right:8px!important; transform:none!important;
    top:58px!important; max-width:none!important; width:auto!important;
    justify-content:flex-start!important; padding:5px!important;
    -webkit-overflow-scrolling:touch;
  }
  #blmap-host .blmap-lyr{ height:32px; padding:0 11px 0 9px!important; font-size:11.5px; flex:0 0 auto; }
  #blmap-host .blmap-gmap-badge{ right:auto!important; left:12px!important; top:12px!important; font-size:10px; padding:4px 9px; }
  #blmap-host .blmap-acts{ bottom:10px!important; max-width:calc(100% - 16px); overflow-x:auto; }
}

#blmap-host .blmap-grid.chat-on .blmap-gmap-badge{display:none}
#blmap-host .blmap-setup{display:none!important}
@media(max-width:1200px){
 /* janela mais estreita: a barra de camadas desce para nao ficar embaixo dos botoes */
 #blmap-host .blmap-layers{left:12px!important;right:12px!important;top:58px!important;transform:none!important;max-width:none!important;justify-content:flex-start}
 #blmap-host .mpp-speedo{top:106px}
 #blmap-host .mpp-hud{top:174px!important}
 #blmap-host .blmap-grid.side-on .blmap-layers{left:322px!important}
}
@media(max-width:860px){
 #blmap-host .blmap-grid{height:calc(100vh - 150px);min-height:440px}
 #blmap-host .blmap-side,#blmap-host .blmap-chat{width:88%}
 #blmap-host .blmap-grid.side-on .blm-tog.l,#blmap-host .blmap-grid.chat-on .blm-tog.r{display:none}
 #blmap-host .blmap-layers{max-width:none!important;left:10px!important;right:10px!important;top:52px!important;transform:none!important;justify-content:flex-start}
 #blmap-host .blmap-lyr{height:32px;padding:0 10px 0 8px!important;font-size:11px!important;gap:5px}
 #blmap-host .blmap-lyr svg,#blmap-host .blmap-lyr .blmap-ic{width:15px;height:15px}
 #blmap-host .blmap-acts{gap:4px;padding:5px}
 #blmap-host .blmap-acts button{padding:9px 10px!important;font-size:11px!important}
 .blm-tog span.tx{display:none}
}

.blmap-gmap .leaflet-container{background:#0a0d12;font-family:Inter,system-ui,sans-serif}
.blmap-gmap .leaflet-tile{filter:invert(1) hue-rotate(192deg) saturate(.5) brightness(.78) contrast(1.12) sepia(.28)}
.blmap-gmap.eng-google .leaflet-tile{filter:none}
.mapeng-sw{display:flex;gap:10px;flex-wrap:wrap;margin:6px 0 14px}
.mapeng-opt{flex:1 1 180px;text-align:left;background:#15171b;border:1px solid #2c3038;border-radius:10px;padding:12px 14px;cursor:pointer;color:#c3c7cf;transition:border-color .15s,background .15s}
.mapeng-opt b{display:block;font-size:14px;color:#e8eaed;margin-bottom:3px}
.mapeng-opt small{display:block;font-size:11.5px;color:#8b919b;line-height:1.4}
.mapeng-opt:hover{border-color:#4a505a}
.mapeng-opt.on{border-color:#2ec77a;background:rgba(46,199,122,.09)}
.mapeng-opt.on b:after{content:' \2713';color:#2ec77a}
.mapeng-live{font-size:12px;color:#9aa0aa;margin:-4px 0 12px}
.mapeng-live b{color:#e8eaed}
.blmap-gmap .leaflet-tile-container{will-change:auto}
.blmap-gmap .leaflet-control-attribution{background:rgba(8,10,14,.72);color:#6f7681;font-size:9.5px;border-radius:6px 0 0 0}
.blmap-gmap .leaflet-control-attribution a{color:#8e96a2}
.blm-ico{background:none;border:0}
.blm-mk{display:inline-flex;align-items:center;gap:5px;background:rgba(10,13,18,.9);border:1px solid rgba(255,255,255,.22);border-radius:999px;padding:3px 9px;color:#fff;font:600 10.5px/1.3 Inter,system-ui,sans-serif;white-space:nowrap;box-shadow:0 3px 12px rgba(0,0,0,.55);transform:translate(-50%,-50%);cursor:pointer;transition:transform .15s}
.blm-mk:hover{transform:translate(-50%,-50%) scale(1.08)}
.blm-mk .s{font-size:12px;line-height:1}
.blm-mk svg{width:12px;height:12px}
.blm-mk.me{background:var(--yellow,#F2C230);border-color:#fff3c4;color:#15171b;font-weight:800;box-shadow:0 0 0 5px rgba(242,194,48,.18),0 3px 12px rgba(0,0,0,.6)}
.blm-mk.on{border-color:rgba(46,199,122,.75);color:#bdf0d4}
.blm-mk.race{border-color:rgba(255,93,93,.85);color:#ffc0c0}
.blm-mk.gar{border-color:rgba(88,166,255,.75);color:#bcdcff}
.blm-mk.part{border-color:rgba(242,194,48,.75);color:#F2C230}
.blm-mk.ev{border-color:rgba(196,160,255,.75);color:#e2d2ff}
.blm-mk.rd{border-color:rgba(255,157,60,.85);color:#ffd7ab}
.blm-mk.pol{border-color:rgba(120,170,255,.8);color:#cfe0ff}
.blm-pop{font:400 12.5px/1.5 Inter,system-ui,sans-serif;color:#15171b}
.blmap-gmap .leaflet-popup-content-wrapper{background:#f4f5f7;border-radius:10px}
.blmap-gmap .leaflet-popup-tip{background:#f4f5f7}
/* painel de controle do mapa (admin) */
.mmg-tabs{display:flex;gap:6px;flex-wrap:wrap;margin:12px 0}
.mmg-tab{position:relative;background:#141519;border:1px solid #2a2e36;color:#c3c7cf;border-radius:8px;padding:9px 13px;font-family:'Oswald',sans-serif;font-size:12.5px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:6px}
.mmg-tab span{background:rgba(255,255,255,.1);border-radius:20px;padding:1px 7px;font-size:11px}
.mmg-tab.on{background:var(--yellow,#F2C230);color:#111;border-color:var(--yellow,#F2C230)}
.mmg-tab.on span{background:rgba(0,0,0,.15)}
.mmg-badge{position:absolute;top:-6px;right:-6px;background:var(--red,#D21F1F);color:#fff;font-style:normal;font-size:10px;font-weight:700;min-width:16px;height:16px;border-radius:9px;display:flex;align-items:center;justify-content:center;padding:0 4px}
.mmg-list{display:flex;flex-direction:column;gap:7px;margin-bottom:10px}
.mmg-row{display:flex;align-items:center;gap:10px;padding:10px 12px;background:#141519;border:1px solid #23262d;border-radius:9px}
.mmg-row.pend{border-color:rgba(217,158,16,.5);background:rgba(217,158,16,.06)}
.mmg-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.mmg-nm{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.mmg-nm b{color:#fff;font-size:14px}
.mmg-info>span{color:#9aa0aa;font-size:12px}
.mmg-tag{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:2px 7px;border-radius:5px}
.mmg-tag.demo{background:#3a3f48;color:#c3c7cf}
.mmg-tag.pend{background:#d99e10;color:#111}
.mmg-acts{display:flex;gap:6px;flex-wrap:wrap}
.mmg-acts button{border:none;border-radius:6px;padding:8px 12px;font-size:12px;font-weight:700;cursor:pointer;font-family:'Oswald',sans-serif}
.mmg-ok{background:#2ec77a;color:#04220f}
.mmg-hide{background:#3a3f48;color:#fff}
.mmg-del{background:var(--red,#D21F1F);color:#fff}
.mmg-cleardemo{background:none;border:1px dashed #3a3f48;color:#9aa0aa;border-radius:8px;padding:9px 14px;font-size:12.5px;cursor:pointer;font-family:'Oswald',sans-serif}
.mmg-cleardemo:hover{border-color:var(--yellow,#F2C230);color:var(--yellow,#F2C230)}
.blmap-map.gmap-on svg,.blmap-map.gmap-on .mp-label,.blmap-map.gmap-on .mp-blip{opacity:0;pointer-events:none}
.blmap-map.gmap-on .blmap-pin,.blmap-map.gmap-on .blmap-radar{display:none}
.blmap-map .blmap-navbar,.blmap-map .blmap-alert,.blmap-map .blmap-voice{z-index:4}
.blmap-gmap-badge{position:absolute;left:12px;top:12px;z-index:3;background:rgba(8,10,14,.8);border:1px solid rgba(242,194,48,.4);color:var(--yellow,#F2C230);font-family:'Oswald',sans-serif;font-size:10px;letter-spacing:1px;text-transform:uppercase;padding:5px 10px;border-radius:6px;display:none}
.blmap-map.gmap-on .blmap-gmap-badge{display:block}
.blmap-map svg{position:absolute;inset:0;width:100%;height:100%}
.blmap-map .rd1{stroke:#1c2029;stroke-width:6;fill:none}.blmap-map .rd2{stroke:#151820;stroke-width:3;fill:none}
.blmap-map .rt-glow{stroke:var(--yellow);stroke-width:1.2;fill:none;opacity:.2;stroke-dasharray:4 8;animation:blmapflow 3s linear infinite}
.blmap-map .rt-route{stroke:#38a4ff;stroke-width:4;fill:none;stroke-linecap:round;stroke-dasharray:2 10;animation:blmapflow 1s linear infinite;filter:drop-shadow(0 0 5px #38a4ff)}
.blmap-map .mp-water{fill:rgba(40,90,150,.18);stroke:rgba(56,164,255,.25);stroke-width:1}
.blmap-map .mp-park{fill:rgba(46,199,122,.08);stroke:rgba(46,199,122,.2);stroke-width:1}
.blmap-map .mp-hw{stroke:rgba(242,194,48,.15);stroke-width:9;fill:none}
.blmap-map .mp-blip{fill:#fff;filter:drop-shadow(0 0 6px #fff);animation:mpblip 1.4s ease-out infinite}
@keyframes mpblip{0%{r:3;opacity:1}100%{r:16;opacity:0}}
.mp-label{position:absolute;z-index:3;font-family:'Oswald',sans-serif;font-size:10px;letter-spacing:2px;color:rgba(255,255,255,.22);text-transform:uppercase;pointer-events:none;transform:translate(-50%,-50%);font-weight:600}
.blmap-pin{transition:left .8s ease,top .8s ease}
.blmap-pin.me .pt{animation:mepulse 2s ease-in-out infinite}
@keyframes mepulse{50%{box-shadow:0 0 24px rgba(255,255,255,.7)}}
@keyframes blmapflow{to{stroke-dashoffset:-24}}
.blmap-pin{position:absolute;transform:translate(-50%,-100%);z-index:5}
.blmap-pin .pt{padding:5px 9px;border-radius:8px;background:rgba(8,9,11,.92);border:1.5px solid;display:flex;align-items:center;gap:5px;transform:skewX(-7deg)}
.blmap-ic{display:inline-flex;width:16px;height:16px;transform:skewX(7deg)}
.blmap-ic svg{width:100%;height:100%}
.blmap-pin .n{font-family:'Permanent Marker',cursive;font-size:11px}.blmap-pin .n.w{color:#fff}
.blmap-tag .blmap-ic{width:15px;height:15px;transform:skewX(7deg)}
.blmap-radar .ic .blmap-ic,.blmap-radar .ic{width:17px;height:17px;display:inline-flex}
.blmap-lyr .blmap-ic{width:13px;height:13px;vertical-align:-2px;margin-right:2px}
.blmap-acts button .blmap-ic{width:14px;height:14px;vertical-align:-2px;margin-right:3px}
.blmap-acts button{display:inline-flex;align-items:center}
.blmap-alert>.blmap-ic{width:26px;height:26px;flex:none;color:#fff}
.blmap-voice>.blmap-ic{width:15px;height:15px;color:var(--yellow);vertical-align:-2px}
.blmap-pin.on .pt{border-color:#2ec77a;color:#4ade80}.blmap-pin.race .pt{border-color:var(--red);color:#ff6b6b}.blmap-pin.gar .pt{border-color:var(--yellow);color:var(--yellow)}.blmap-pin.me .pt{border-color:#fff;color:#fff;box-shadow:0 0 14px rgba(255,255,255,.4)}
.blmap-radar{position:absolute;transform:translate(-50%,-50%);z-index:6}
.blmap-radar .ic{width:32px;height:32px;border-radius:9px;background:rgba(210,31,31,.15);border:2px solid var(--red);display:flex;align-items:center;justify-content:center;font-size:15px}
.blmap-radar .ring{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:32px;height:32px;border-radius:50%;border:2px solid rgba(210,31,31,.5);animation:blmaprip 2s ease-out infinite}
@keyframes blmaprip{0%{width:20px;height:20px;opacity:.8}100%{width:80px;height:80px;opacity:0}}
.blmap-navbar{position:absolute;top:54px;left:50%;transform:translateX(-50%);z-index:20;width:min(440px,92%);background:rgba(16,17,20,.95);border:1px solid var(--line);border-radius:12px;padding:10px 14px;display:flex;align-items:center;gap:12px}
.blmap-navbar .dl{font-size:10px;color:#9aa0aa;text-transform:uppercase;letter-spacing:1px}.blmap-navbar .dv{font-size:14px;font-weight:600}
.blmap-navbar .eta{margin-left:auto;text-align:right}.blmap-navbar .eta b{font-family:'Racing Sans One';font-size:18px;color:#38a4ff}.blmap-navbar .eta span{display:block;font-size:10px;color:#9aa0aa}
.blmap-alert{position:absolute;top:116px;left:50%;transform:translateX(-50%);z-index:25;width:min(380px,90%);background:linear-gradient(90deg,rgba(210,31,31,.95),rgba(140,20,20,.95));border-radius:12px;padding:10px 14px;display:flex;align-items:center;gap:12px;animation:blmapbeep 1s ease-in-out infinite}
@keyframes blmapbeep{50%{box-shadow:0 8px 30px -6px rgba(210,31,31,.9)}}
.blmap-alert>div:not(.d){font-size:12px}.blmap-alert b{display:block;font-size:14px}.blmap-alert span{font-size:11px;opacity:.9}
.blmap-alert .d{margin-left:auto;text-align:right}.blmap-alert .d b{font-family:'Racing Sans One';font-size:22px}.blmap-alert .d span{font-size:10px}
.blmap-voice{position:absolute;bottom:66px;left:50%;transform:translateX(-50%);z-index:20;background:rgba(0,0,0,.8);border:1px solid var(--line);border-radius:20px;padding:7px 14px;font-size:12px;color:#c3c7cf;display:flex;align-items:center;gap:8px;white-space:nowrap}
.blmap-voice .wv{display:flex;gap:2px}.blmap-voice .wv i{width:2.5px;height:11px;background:var(--yellow);border-radius:2px;animation:blmapwave .8s ease-in-out infinite}
.blmap-voice .wv i:nth-child(2){animation-delay:.15s}.blmap-voice .wv i:nth-child(3){animation-delay:.3s}
@keyframes blmapwave{50%{height:4px}}
.blmap-acts{position:absolute;left:12px;bottom:12px;display:flex;gap:7px;z-index:20;flex-wrap:wrap;max-width:calc(100% - 24px)}
.blmap-acts button{height:40px;padding:0 13px;border:none;border-radius:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;font-size:11px;cursor:pointer;font-family:'Oswald'}
.blmap-acts .a-nav{background:#38a4ff;color:#04223f}.blmap-acts .a-rad{background:var(--red);color:#fff}.blmap-acts .a-ev{background:#c084fc;color:#1a0b2e}.blmap-acts .a-reg{background:var(--yellow);color:#111}.blmap-acts .a-crews{background:linear-gradient(135deg,#2ec77a,#1a9d5b);color:#04220f}
.blmap-acts .a-shop{background:linear-gradient(135deg,#F2C230,#d99e10);color:#111}
.blmap-acts .a-tej{background:linear-gradient(135deg,#e94b4b,#8a1f1f);color:#fff}
#tej-ov{position:fixed;inset:0;z-index:10120;background:rgba(0,0,0,.72);backdrop-filter:blur(4px);display:none;align-items:flex-end;justify-content:center}
#tej-ov.on{display:flex}
@media(min-width:721px){#tej-ov{align-items:center}}
.tej-box{width:100%;max-width:460px;height:min(78vh,620px);background:#0e0f12;border:1px solid #23262d;border-top:3px solid #e94b4b;border-radius:18px 18px 0 0;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 -20px 60px rgba(0,0,0,.6)}
@media(min-width:721px){.tej-box{border-radius:18px;height:min(80vh,640px)}}
.tej-h{display:flex;align-items:center;gap:11px;padding:14px 16px;background:linear-gradient(90deg,rgba(233,75,75,.16),transparent);border-bottom:1px solid #1e2128}
.tej-av{width:42px;height:42px;flex:none;border-radius:50%;background:linear-gradient(135deg,#e94b4b,#8a1f1f);display:flex;align-items:center;justify-content:center;color:#fff}
.tej-av svg{width:22px;height:22px}
.tej-hn{display:flex;flex-direction:column;line-height:1.2;flex:1;min-width:0}
.tej-hn b{font-family:'Oswald',sans-serif;font-size:16px;color:#fff;letter-spacing:.5px}
.tej-hn span{font-size:11px;color:#9aa0aa}
.tej-x{background:none;border:none;color:#9aa0aa;font-size:26px;cursor:pointer;line-height:1;padding:0 4px}
.tej-x:hover{color:#fff}
.tej-msgs{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px}
.tej-m{max-width:82%;padding:10px 13px;border-radius:14px;font-size:13.5px;line-height:1.5;color:#e8eaee}
.tej-m.tej{background:#1a1d23;border:1px solid #262a31;border-bottom-left-radius:4px;align-self:flex-start}
.tej-m.me{background:linear-gradient(135deg,#e94b4b,#b02f2f);color:#fff;border-bottom-right-radius:4px;align-self:flex-end}
.tej-chips{display:flex;gap:7px;overflow-x:auto;padding:8px 14px;border-top:1px solid #1a1d22;scrollbar-width:none}
.tej-chips::-webkit-scrollbar{display:none}
.tej-chips button{flex:none;white-space:nowrap;background:rgba(233,75,75,.12);border:1px solid rgba(233,75,75,.35);color:#ffb3b3;font-size:12px;padding:7px 12px;border-radius:20px;cursor:pointer;font-family:'Oswald',sans-serif}
.tej-chips button:hover{background:rgba(233,75,75,.25);color:#fff}
.tej-bar{display:flex;gap:8px;padding:12px 14px;border-top:1px solid #1e2128;background:#0b0c0f}
.tej-bar input{flex:1;background:#16181d;border:1px solid #2a2e36;border-radius:22px;padding:11px 15px;color:#fff;font-family:inherit;font-size:14px;outline:none}
.tej-bar input:focus{border-color:#e94b4b}
.tej-snd{flex:none;width:44px;height:44px;border-radius:50%;border:none;background:linear-gradient(135deg,#e94b4b,#8a1f1f);color:#fff;font-size:16px;cursor:pointer}
/* Map Shop, versão premium */
.mapshop-ov{position:fixed;inset:0;z-index:10180;background:rgba(0,0,0,.85);backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;padding:16px}
.mapshop-ov.on{display:flex}
.ms2-box{position:relative;background:linear-gradient(180deg,#13151a,#0a0b0d);border:1px solid rgba(255,255,255,.12);border-radius:20px;width:100%;max-width:760px;max-height:90vh;overflow-y:auto;box-shadow:0 30px 80px -12px #000}
.ms2-x{position:absolute;top:14px;right:14px;z-index:5;background:rgba(0,0,0,.5);border:1px solid rgba(255,255,255,.15);color:#fff;width:34px;height:34px;border-radius:10px;font-size:18px;cursor:pointer}
.ms2-hero{position:relative;display:flex;align-items:center;gap:20px;padding:26px 26px 22px;border-bottom:1px solid rgba(255,255,255,.08);overflow:hidden}
.ms2-hero-glow{position:absolute;top:-40%;right:-10%;width:340px;height:340px;background:radial-gradient(circle,rgba(242,194,48,.16),transparent 70%);pointer-events:none}
.ms2-hero-l{flex:1;position:relative;z-index:2}
.ms2-tag{display:inline-flex;align-items:center;gap:7px;font-family:'Oswald',sans-serif;font-size:11px;letter-spacing:2px;color:var(--yellow);background:rgba(242,194,48,.1);border:1px solid rgba(242,194,48,.3);padding:5px 11px;border-radius:20px}
.ms2-tag svg{width:13px;height:13px}
.ms2-hero-l h2{font-family:'Racing Sans One',sans-serif;font-size:28px;color:#fff;margin:12px 0 6px;line-height:1}
.ms2-hero-l h2 b{color:var(--yellow)}
.ms2-hero-l p{color:#9aa0aa;font-size:13.5px;max-width:340px;line-height:1.5}
.ms2-hero-feat{position:relative;z-index:2;width:130px;flex:none;background:linear-gradient(160deg,rgba(255,255,255,.06),transparent);border:1px solid var(--yellow);border-radius:16px;padding:16px 12px;text-align:center;box-shadow:0 0 30px -8px rgba(242,194,48,.4)}
.ms2-feat-badge{position:absolute;top:-9px;left:50%;transform:translateX(-50%);background:var(--yellow);color:#111;font-size:9px;font-weight:700;padding:2px 9px;border-radius:8px;letter-spacing:1px;font-family:'Oswald',sans-serif}
.ms2-feat-ic{width:52px;height:52px;margin:6px auto 8px;color:var(--rc,#F2C230)}.ms2-feat-ic svg{width:100%;height:100%}
.ms2-feat-nm{font-family:'Oswald',sans-serif;font-size:14px;color:#fff}
@media(max-width:560px){.ms2-hero{flex-direction:column;text-align:center}.ms2-hero-l p{max-width:none}}
.ms2-tabs{display:flex;gap:8px;padding:16px 26px 0;flex-wrap:wrap}
.ms2-tab{background:rgba(255,255,255,.04);border:1px solid var(--line);color:#c3c7cf;border-radius:20px;padding:9px 18px;font-family:'Oswald',sans-serif;font-size:13px;cursor:pointer;transition:.12s}
.ms2-tab.on{background:var(--yellow);color:#111;border-color:var(--yellow);font-weight:600}
.ms2-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;padding:18px 26px 26px}
.ms2-card{position:relative;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:16px;padding:16px 14px;text-align:center;transition:.15s;overflow:hidden}
.ms2-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--rc)}
.ms2-card:hover{border-color:var(--rc);transform:translateY(-3px);box-shadow:0 12px 30px -10px rgba(0,0,0,.6)}
.ms2-rar{display:inline-block;font-size:9px;font-weight:700;letter-spacing:1px;color:var(--rc);background:color-mix(in srgb,var(--rc) 14%,transparent);border:1px solid color-mix(in srgb,var(--rc) 40%,transparent);padding:2px 8px;border-radius:8px;text-transform:uppercase;font-family:'Oswald',sans-serif;margin-bottom:10px}
.ms2-prev{width:56px;height:56px;margin:2px auto 10px;color:var(--rc);filter:drop-shadow(0 0 10px color-mix(in srgb,var(--rc) 40%,transparent))}
.ms2-prev svg{width:100%;height:100%}
.ms2-nm{font-family:'Oswald',sans-serif;font-size:15px;color:#fff;font-weight:600}
.ms2-desc{font-size:11px;color:#9aa0aa;line-height:1.4;margin:4px 0 12px;min-height:30px}
.ms2-buy{width:100%;background:var(--yellow);color:#111;border:none;border-radius:9px;padding:9px;font-family:'Oswald',sans-serif;font-weight:600;font-size:12.5px;cursor:pointer;transition:.12s}
.ms2-buy:hover{filter:brightness(1.08)}
.ms2-buy.owned{background:rgba(46,199,122,.14);color:#4ade80;border:1px solid rgba(46,199,122,.3);cursor:default}
.blmap-ctabs{display:flex;border-bottom:1px solid var(--line)}
.blmap-ctabs button{flex:1;padding:11px 4px;background:none;border:none;color:#9aa0aa;font-size:11.5px;cursor:pointer;border-bottom:2px solid transparent;font-family:'Oswald'}
.blmap-ctabs button.on{color:var(--yellow);border-bottom-color:var(--yellow)}
.blmap-tc{display:none;flex-direction:column;height:calc(100% - 42px)}.blmap-tc.on{display:flex}
.blmap-msgs{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:8px}
.blmap-msgs .m{max-width:82%;padding:8px 11px;border-radius:12px;font-size:12.5px}
.blmap-msgs .them{background:rgba(255,255,255,.06);align-self:flex-start;border-bottom-left-radius:3px}
.blmap-msgs .me{background:var(--yellow);color:#111;align-self:flex-end;border-bottom-right-radius:3px}
.blmap-cbar{padding:10px;border-top:1px solid var(--line);display:flex;gap:6px}
.blmap-cbar button{background:rgba(56,164,255,.12);border:1px solid rgba(56,164,255,.3);color:#7bc0ff;width:38px;border-radius:9px;font-size:15px;cursor:pointer}
.blmap-cbar .snd{background:var(--yellow);border:none;color:#111}
.blmap-cbar input{flex:1;background:#0c0d10;border:1px solid var(--line);border-radius:9px;color:#fff;padding:9px 11px;font-family:'Oswald';font-size:13px}
.blmap-ev{margin:12px;border:1px solid rgba(192,132,252,.4);border-radius:12px;overflow:hidden}
.blmap-ev .cov{height:80px;background:linear-gradient(135deg,#3b1f5e,#1a0b2e);display:flex;align-items:flex-end;padding:9px}
.blmap-ev .dt{background:var(--yellow);color:#111;font-family:'Bebas Neue';font-size:13px;padding:3px 9px;border-radius:5px;letter-spacing:1px}
.blmap-ev .eb{padding:10px 12px}.blmap-ev .en{font-family:'Racing Sans One';font-size:15px}.blmap-ev .em{font-size:11px;color:#c084fc;margin:3px 0 8px}
.blmap-ev button{width:100%;background:#c084fc;color:#1a0b2e;border:none;border-radius:8px;padding:8px;font-weight:700;font-family:'Oswald';cursor:pointer}
.blmap-blh{text-align:center;padding:14px 12px 8px}.blmap-blh .t{font-family:'Permanent Marker',cursive;font-size:24px;color:var(--red);text-shadow:0 0 14px rgba(210,31,31,.5)}.blmap-blh .s{font-size:10.5px;color:#9aa0aa;text-transform:uppercase;letter-spacing:2px}
.blmap-blr{display:flex;align-items:center;gap:10px;padding:10px 13px;border-bottom:1px solid rgba(255,255,255,.04);position:relative}
.blmap-blr.top{background:linear-gradient(90deg,rgba(210,31,31,.12),transparent)}
.blmap-blr .rk{font-family:'Racing Sans One';font-size:20px;width:30px;text-align:center;color:#5a5f66}.blmap-blr.top .rk{color:var(--red)}
.blmap-blr .bn{font-family:'Permanent Marker',cursive;font-size:13px}.blmap-blr .bc{font-size:10.5px;color:#9aa0aa}.blmap-blr .bi{flex:1}
.blmap-blr .bp b{font-family:'Racing Sans One';font-size:15px;color:var(--yellow)}
.blmap-blr .mw{background:var(--red);color:#fff;font-size:8.5px;padding:2px 6px;border-radius:7px;position:absolute;top:6px;right:10px;font-weight:700;letter-spacing:1px}
/* Map admin */
#mapcfg-admin .map-status{border-radius:10px;padding:11px 15px;font-family:'Oswald';font-size:14px;margin-bottom:14px;font-weight:600}
#mapcfg-admin .map-status.live{background:rgba(46,199,122,.12);border:1px solid rgba(46,199,122,.4);color:#4ade80}
#mapcfg-admin .map-status.off{background:rgba(242,194,48,.1);border:1px solid rgba(242,194,48,.4);color:#e6c14e}
#mapcfg-admin .pay-sec{background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:14px;padding:16px;margin-bottom:14px}
#mapcfg-admin .pay-sec-h b{display:block;font-family:'Oswald';font-size:16px;color:var(--yellow)}
#mapcfg-admin .pay-sec-h span{display:block;color:#9aa0aa;font-size:12px;margin-top:2px}
#mapcfg-admin .set-lbl{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:#bdbdbd;margin:12px 0 6px}
#mapcfg-admin .set-opt{text-transform:none;letter-spacing:0;color:#7a7f88;font-size:10.5px}
#mapcfg-admin .set-in{width:100%;background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#fff;font-family:'Oswald';font-size:14px;padding:11px 12px;box-sizing:border-box}
#mapcfg-admin textarea.set-in{font-family:monospace;font-size:12px;resize:vertical}
#mapcfg-admin .set-btn{margin-top:14px;background:var(--yellow);color:#111;border:none;border-radius:10px;padding:11px 22px;font-family:'Oswald';font-weight:600;font-size:14px;cursor:pointer}
#mapcfg-admin .set-msg{margin-left:10px;font-size:13px;font-family:'Oswald'}
#mapcfg-admin .map-steps{display:flex;flex-direction:column;gap:10px}
#mapcfg-admin .map-step{display:flex;gap:12px;align-items:flex-start;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:11px;padding:12px}
#mapcfg-admin .msn{flex:none;width:28px;height:28px;border-radius:50%;background:var(--yellow);color:#111;font-weight:bold;display:flex;align-items:center;justify-content:center;font-family:'Oswald'}
#mapcfg-admin .map-step b{display:block;color:#fff;font-family:'Oswald';font-size:14px}
#mapcfg-admin .map-step small{display:block;color:#9aa0aa;font-size:12px;line-height:1.5;margin:3px 0}
#mapcfg-admin .msl{display:inline-block;margin-top:5px;color:var(--yellow);font-size:12.5px;text-decoration:none;font-family:'Oswald'}
#mapcfg-admin .msl:hover{text-decoration:underline}
/* payouts das apostas */
#mapcfg-admin .po-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}
#mapcfg-admin .po-sum{background:rgba(46,199,122,.06);border:1px solid rgba(46,199,122,.25);border-radius:10px;padding:10px 8px;text-align:center}
#mapcfg-admin .po-sum b{display:block;font-family:'Racing Sans One',sans-serif;font-size:19px;color:#4ade80}
#mapcfg-admin .po-sum span{font-size:9.5px;color:#9aa0aa;text-transform:uppercase}
#mapcfg-admin .po-list{margin-top:12px;display:flex;flex-direction:column;gap:8px}
#mapcfg-admin .po-row{display:flex;align-items:center;justify-content:space-between;gap:10px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:11px;padding:11px 13px;flex-wrap:wrap}
#mapcfg-admin .po-info b{font-family:'Oswald',sans-serif;font-size:14px}
#mapcfg-admin .po-info>span{display:block;font-size:11px;color:#9aa0aa;margin:2px 0}
#mapcfg-admin .po-money{font-size:12px;color:#c3c7cf;margin-top:3px}
#mapcfg-admin .po-cut{color:#4ade80}
#mapcfg-admin .po-pay{background:var(--yellow);color:#111;border:none;border-radius:9px;padding:9px 14px;font-family:'Oswald',sans-serif;font-weight:600;font-size:12.5px;cursor:pointer}
#mapcfg-admin .po-done{color:#4ade80;font-size:12.5px;font-family:'Oswald',sans-serif;background:rgba(46,199,122,.1);border:1px solid rgba(46,199,122,.3);border-radius:8px;padding:7px 12px}
/* Integrations */
#integrations-admin .intg-card{background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:14px;padding:16px;margin-bottom:12px}
#integrations-admin .intg-h{display:flex;align-items:flex-start;gap:12px;margin-bottom:10px}
#integrations-admin .intg-ic{font-size:24px;flex:none}
#integrations-admin .intg-h b{display:block;font-family:'Oswald',sans-serif;font-size:16px;color:#fff}
#integrations-admin .intg-h small{display:block;color:#9aa0aa;font-size:12px;line-height:1.5;margin-top:2px}
#integrations-admin .intg-st{margin-left:auto;font-size:11px;padding:3px 10px;border-radius:10px;font-family:'Oswald',sans-serif;white-space:nowrap;flex:none}
#integrations-admin .intg-st.on{background:rgba(46,199,122,.14);color:#4ade80;border:1px solid rgba(46,199,122,.3)}
#integrations-admin .intg-st.off{background:rgba(255,255,255,.05);color:#9aa0aa;border:1px solid var(--line)}
#integrations-admin .intg-lbl{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:#bdbdbd;margin:10px 0 5px}
#integrations-admin .intg-in{width:100%;background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:8px;color:#fff;font-family:'Oswald',sans-serif;font-size:13.5px;padding:9px 11px;box-sizing:border-box}
#integrations-admin textarea.intg-in{font-family:monospace;font-size:12px;resize:vertical}
#integrations-admin .intg-link{display:inline-block;margin-top:9px;color:var(--yellow);font-size:12.5px;text-decoration:none;font-family:'Oswald',sans-serif}
#integrations-admin .intg-link:hover{text-decoration:underline}
#integrations-admin .set-btn{background:var(--yellow);color:#111;border:none;border-radius:10px;padding:12px 22px;font-family:'Oswald',sans-serif;font-weight:600;font-size:14px;cursor:pointer}
#integrations-admin .set-msg{margin-left:10px;font-size:13px;font-family:'Oswald',sans-serif}
/* Developer panel */
#developer-admin .dev-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px}
#developer-admin .dev-st{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:11px;padding:12px 8px;text-align:center}
#developer-admin .dev-st b{display:block;font-family:'Racing Sans One',sans-serif;font-size:18px;color:var(--yellow)}
#developer-admin .dev-st span{font-size:10px;color:#9aa0aa;text-transform:uppercase}
#developer-admin .pay-sec{background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:14px;padding:16px;margin-bottom:12px}
#developer-admin .pay-sec-h b{display:block;font-family:'Oswald',sans-serif;font-size:15px;color:var(--yellow)}
#developer-admin .pay-sec-h span{display:block;color:#9aa0aa;font-size:12px;margin-top:2px}
#developer-admin .dev-code{width:100%;background:#0a0b0d;border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#c8e6c9;font-family:monospace;font-size:12.5px;padding:11px;box-sizing:border-box;margin-top:10px;resize:vertical;line-height:1.5}
#developer-admin .dev-lbl{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:#bdbdbd;margin:10px 0 5px}
#developer-admin .dev-in{width:100%;background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:8px;color:#fff;font-family:monospace;font-size:12.5px;padding:9px 11px;box-sizing:border-box}
#developer-admin .dev-btn{margin-top:10px;background:var(--yellow);color:#111;border:none;border-radius:9px;padding:10px 20px;font-family:'Oswald',sans-serif;font-weight:600;font-size:13.5px;cursor:pointer}
#developer-admin .set-msg{margin-left:10px;font-size:13px;font-family:'Oswald',sans-serif}
/* ===== RACER PROFILE (painel do cliente) ===== */
.acct-nav-racer{position:relative;background:linear-gradient(135deg,rgba(242,194,48,.14),rgba(210,31,31,.1))!important;border-color:rgba(242,194,48,.4)!important}
.acct-nav-hot{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:var(--red);color:#fff;font-size:8.5px;padding:2px 6px;border-radius:7px;font-weight:700;letter-spacing:1px}
.acct-nav-map{background:linear-gradient(135deg,rgba(56,164,255,.12),transparent)!important;border-color:rgba(56,164,255,.35)!important}
.rp-hero-note{background:linear-gradient(135deg,rgba(242,194,48,.1),rgba(210,31,31,.06));border:1px solid rgba(242,194,48,.3);border-radius:12px;padding:12px 16px;font-size:13px;color:#e6d9b8;margin-bottom:16px;line-height:1.5}
.rp-hero-note b{color:var(--yellow)}
.rp-card{background:rgba(16,17,20,.6);border:1px solid var(--line);border-radius:18px;overflow:hidden}
.rp-cover{height:130px;background:linear-gradient(135deg,#1c1e26,#0a0b0d);position:relative}
.rp-cover img{width:100%;height:100%;object-fit:cover;opacity:.6}
.rp-editcover{position:absolute;top:12px;right:12px;background:rgba(0,0,0,.6);border:1px solid var(--line);color:#fff;border-radius:9px;padding:6px 12px;font-size:12px;cursor:pointer;font-family:'Oswald',sans-serif}
.rp-top{display:flex;gap:16px;padding:0 22px;margin-top:-42px;position:relative;align-items:flex-end}
.rp-photo{width:96px;height:96px;border-radius:18px;border:3px solid var(--yellow);background:linear-gradient(135deg,#2a2d36,#14161b);display:flex;align-items:center;justify-content:center;font-family:'Racing Sans One',sans-serif;font-size:34px;color:var(--yellow);flex:none;overflow:hidden;cursor:pointer}
.rp-photo img{width:100%;height:100%;object-fit:cover}
.rp-id{padding-bottom:6px}
.rp-tag{display:inline-flex;align-items:center;gap:7px;background:linear-gradient(135deg,#1c1e26,#0d0e12);border:1.5px solid var(--yellow);border-radius:10px;padding:5px 12px;transform:skewX(-7deg)}
.rp-tag .s{font-size:18px;color:var(--yellow)}.rp-tag .n{font-family:'Permanent Marker',cursive;font-size:18px;color:#fff}
.rp-name{font-family:'Racing Sans One',sans-serif;font-size:20px;margin-top:5px}
.rp-loc{color:#9aa0aa;font-size:12.5px}
.rp-body{padding:16px 22px}
.rp-score{display:flex;align-items:center;gap:18px;background:rgba(242,194,48,.06);border:1px solid rgba(242,194,48,.3);border-radius:14px;padding:14px 16px;margin-bottom:14px}
.rp-ring{width:88px;height:88px;flex:none;position:relative}
.rp-ring .rv{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.rp-ring .rv b{font-family:'Racing Sans One',sans-serif;font-size:22px;color:var(--yellow);line-height:1}.rp-ring .rv span{font-size:9px;color:#9aa0aa;text-transform:uppercase}
.rp-scinfo{flex:1}.rp-scinfo .lvl{font-family:'Racing Sans One',sans-serif;font-size:18px}.rp-scinfo .nx{font-size:12px;color:#9aa0aa;margin:2px 0 8px}
.rp-disc{display:inline-flex;align-items:center;gap:6px;background:#2ec77a;color:#04220f;font-weight:700;font-size:13px;padding:5px 12px;border-radius:9px;font-family:'Oswald',sans-serif}
.rp-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:14px}
.rp-st{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:11px;padding:10px 6px;text-align:center}
.rp-st b{display:block;font-family:'Racing Sans One',sans-serif;font-size:18px;color:#fff}.rp-st span{font-size:9.5px;color:#9aa0aa;text-transform:uppercase}
.rp-sect{font-size:11px;color:#9aa0aa;text-transform:uppercase;letter-spacing:1px;margin:12px 0 8px}
.rp-garage{display:flex;gap:10px;overflow-x:auto;padding-bottom:6px}
.rp-car{flex:none;width:130px}
.rp-cimg{height:80px;border-radius:10px;background:linear-gradient(135deg,#12161d,#0a0b0d);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;border:1px solid var(--line)}
.rp-cimg img{width:100%;height:100%;object-fit:cover}
.rp-cimg-ph{font-size:11px;color:#7a7f88}
.rp-car.now .rp-cimg{border-color:var(--yellow)}
.rp-car.now .rp-cimg::after{content:'HOJE';position:absolute;top:5px;right:5px;background:var(--yellow);color:#111;font-size:8px;padding:2px 5px;border-radius:5px;font-weight:700;z-index:2}
.rp-car-acts{display:flex;gap:4px;margin-top:5px}
.rp-cbtn{flex:1;background:rgba(255,255,255,.05);border:1px solid var(--line);color:#c3c7cf;border-radius:7px;padding:5px;font-size:12px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.rp-cbtn:hover{border-color:var(--yellow)}
.rp-cbtn.del:hover{border-color:var(--red);color:#ff6b6b}
.rp-cn{padding:6px 2px 0;font-size:11.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rp-caradd{flex:none;width:120px;border:1px dashed var(--line);border-radius:12px;background:none;color:#9aa0aa;font-size:12px;cursor:pointer;font-family:'Oswald',sans-serif}
.rp-syms{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.rp-sym{width:44px;height:44px;border-radius:11px;background:rgba(255,255,255,.04);border:1.5px solid var(--line);font-size:19px;color:var(--yellow);cursor:pointer}
.rp-sym.sel{border-color:var(--yellow);background:rgba(242,194,48,.14)}
.rp-lbl{display:block;font-size:11px;color:#9aa0aa;text-transform:uppercase;letter-spacing:1px;margin:6px 0}
.rp-in{width:100%;background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#fff;font-family:'Permanent Marker',cursive;font-size:15px;padding:10px 12px;box-sizing:border-box}
.rp-cta{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap}
.rp-go{flex:1;min-width:160px;background:var(--yellow);color:#111;border:none;border-radius:11px;padding:13px;font-family:'Oswald',sans-serif;font-weight:700;font-size:14px;cursor:pointer}
.rp-crews{flex:1;min-width:140px;background:rgba(210,31,31,.15);color:#ff6b6b;border:1px solid rgba(210,31,31,.4);border-radius:11px;padding:13px;font-family:'Oswald',sans-serif;font-weight:600;font-size:14px;cursor:pointer}
@media(max-width:640px){.rp-stats{grid-template-columns:repeat(2,1fr)}}
/* ===== CREWS UI ===== */
.crews-ov{position:fixed;inset:0;z-index:10170;background:rgba(0,0,0,.75);backdrop-filter:blur(4px);display:none;align-items:center;justify-content:center;padding:16px}
.crews-ov.on{display:flex}
.crews-box{background:#101216;border:1px solid var(--line);border-radius:18px;width:100%;max-width:520px;max-height:88vh;display:flex;flex-direction:column;overflow:hidden}
.crews-h{display:flex;justify-content:space-between;align-items:center;padding:16px 18px;border-bottom:1px solid var(--line)}
.crews-h b{font-family:'Racing Sans One',sans-serif;font-size:18px;color:var(--yellow)}
.crews-x{background:rgba(255,255,255,.06);border:none;color:#c3c7cf;font-size:18px;width:32px;height:32px;border-radius:8px;cursor:pointer}
.crews-tabs{display:flex;gap:6px;padding:12px 18px 0}
.crews-tabs button{flex:1;background:rgba(255,255,255,.04);border:1px solid var(--line);color:#c3c7cf;border-radius:9px;padding:9px;font-family:'Oswald',sans-serif;font-size:12.5px;cursor:pointer}
.crews-tabs button.on{background:var(--yellow);color:#111;border-color:var(--yellow);font-weight:600}
.crews-body{flex:1;overflow-y:auto;padding:16px 18px}
.crews-empty,.crews-mini{color:#9aa0aa;font-size:13px;text-align:center;padding:22px 10px;line-height:1.6}
.crews-mini{padding:10px;font-size:12px}
.crew-card{display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:12px;padding:12px;margin-bottom:8px;cursor:pointer}
.crew-card:hover{border-color:var(--yellow)}
.crew-sym{width:42px;height:42px;border-radius:11px;background:linear-gradient(135deg,#1c1e26,#0d0e12);display:flex;align-items:center;justify-content:center;font-size:20px;flex:none}
.crew-sym.big{width:56px;height:56px;font-size:28px}
.crew-info{flex:1}.crew-info b{display:block;font-family:'Oswald',sans-serif;font-size:15px}.crew-info span{font-size:11.5px;color:#9aa0aa}
.crew-badge{background:var(--red);color:#fff;font-size:10px;padding:3px 8px;border-radius:8px;font-weight:700}
.crew-join{background:var(--yellow);color:#111;border:none;border-radius:9px;padding:8px 14px;font-family:'Oswald',sans-serif;font-weight:600;font-size:12px;cursor:pointer}
.crew-join:disabled{background:rgba(255,255,255,.08);color:#9aa0aa;cursor:default}
.crew-back{background:none;border:none;color:var(--yellow);font-size:13px;cursor:pointer;margin-bottom:10px;font-family:'Oswald',sans-serif}
.crew-head{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.crew-head h3{font-family:'Racing Sans One',sans-serif;font-size:20px}.crew-head span{font-size:12px;color:#9aa0aa}
.crew-sect{font-size:11px;color:#9aa0aa;text-transform:uppercase;letter-spacing:1px;margin:14px 0 8px}
.crew-req{display:flex;justify-content:space-between;align-items:center;background:rgba(242,194,48,.06);border:1px solid rgba(242,194,48,.25);border-radius:10px;padding:9px 12px;margin-bottom:6px;font-size:13px}
.crew-req .cr-acc{background:#2ec77a;color:#04220f;border:none;border-radius:7px;padding:6px 11px;font-size:11.5px;cursor:pointer;margin-right:5px;font-family:'Oswald',sans-serif}
.crew-req .cr-dec{background:rgba(255,255,255,.08);color:#c3c7cf;border:none;border-radius:7px;padding:6px 11px;font-size:11.5px;cursor:pointer;font-family:'Oswald',sans-serif}
.crew-members{display:flex;gap:6px;flex-wrap:wrap}
.crew-mem{background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:8px;padding:5px 10px;font-size:12px}
.crew-actions{display:flex;gap:8px;margin-top:12px}
.crew-actions button{flex:1;background:rgba(255,255,255,.06);border:1px solid var(--line);color:#fff;border-radius:9px;padding:9px;font-family:'Oswald',sans-serif;font-size:12.5px;cursor:pointer}
.crew-actions .crew-leave{background:rgba(210,31,31,.15);color:#ff6b6b;border-color:rgba(210,31,31,.35)}
.crew-chat{background:rgba(0,0,0,.25);border:1px solid var(--line);border-radius:11px;padding:12px;max-height:180px;overflow-y:auto;display:flex;flex-direction:column;gap:7px;margin-bottom:8px}
.cc-msg{max-width:82%;padding:7px 11px;border-radius:11px;font-size:12.5px}
.cc-msg.them{background:rgba(255,255,255,.06);align-self:flex-start;border-bottom-left-radius:3px}
.cc-msg.me{background:var(--yellow);color:#111;align-self:flex-end;border-bottom-right-radius:3px}
.cc-msg b{display:block;font-size:10px;opacity:.7;margin-bottom:2px}
.crew-cbar{display:flex;gap:7px}
.crew-cbar input{flex:1;background:#0c0d10;border:1px solid var(--line);border-radius:9px;color:#fff;padding:10px 12px;font-family:'Oswald',sans-serif;font-size:13px}
.crew-cbar button{background:var(--yellow);border:none;color:#111;border-radius:9px;width:42px;font-size:16px;cursor:pointer}
.crew-ev{background:rgba(192,132,252,.06);border:1px solid rgba(192,132,252,.3);border-radius:10px;padding:10px 12px;margin-bottom:6px}
.crew-ev b{display:block;font-size:13.5px}.crew-ev>span{font-size:11.5px;color:#c084fc}
.crew-bet{margin-top:6px;font-size:12px;color:#4ade80}.crew-bet small{color:#9aa0aa}
.crew-newev{width:100%;background:rgba(192,132,252,.14);color:#c084fc;border:1px solid rgba(192,132,252,.35);border-radius:10px;padding:11px;font-family:'Oswald',sans-serif;font-weight:600;cursor:pointer;margin-top:8px}
/* card do usuário + convite no mapa */
.blmap-me{background:linear-gradient(135deg,rgba(242,194,48,.1),rgba(210,31,31,.06));border:1px solid rgba(242,194,48,.3);border-radius:12px;padding:12px;margin:12px 12px 4px}
.blmap-me-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.blmap-me-sc{text-align:right}.blmap-me-sc b{font-family:'Racing Sans One',sans-serif;font-size:18px;color:var(--yellow);display:block;line-height:1}.blmap-me-sc span{font-size:9px;color:#9aa0aa;text-transform:uppercase}
.blmap-me-crews{margin-bottom:8px}.blmap-me-crews .lbl{display:block;font-size:9.5px;color:#9aa0aa;text-transform:uppercase;letter-spacing:1px;margin-bottom:5px}
.blmap-crewchip{display:inline-block;background:rgba(255,255,255,.06);border:1px solid var(--line);border-radius:8px;padding:4px 9px;font-size:11.5px;margin:0 4px 4px 0;cursor:pointer}
.blmap-nocrew{display:inline-block;color:var(--yellow);font-size:12px;cursor:pointer}
.blmap-me-btn{width:100%;background:var(--yellow);color:#111;border:none;border-radius:9px;padding:9px;font-family:'Oswald',sans-serif;font-weight:600;font-size:12.5px;cursor:pointer}
.blmap-me-idw{display:flex;align-items:center;gap:8px;cursor:pointer}
.blmap-me-photo{width:38px;height:38px;border-radius:10px;border:2px solid var(--yellow);background:linear-gradient(135deg,#2a2d36,#14161b);display:flex;align-items:center;justify-content:center;font-size:18px;color:var(--yellow);overflow:hidden;flex:none}
.blmap-me-photo img{width:100%;height:100%;object-fit:cover}
.blmap-me-btns{display:flex;gap:7px}
.blmap-me-btns .blmap-me-btn{flex:1}
.blmap-me-btns .blmap-me-btn.crews{background:linear-gradient(135deg,#2ec77a,#1a9d5b);color:#04220f}
.blmap-racer{cursor:pointer}
.blmap-search{width:calc(100% - 24px);margin:0 12px 8px;background:#0c0d10;border:1px solid var(--line);border-radius:9px;color:#fff;padding:9px 12px;font-family:'Oswald',sans-serif;font-size:13px;box-sizing:border-box}
.blmap-search:focus{outline:none;border-color:var(--yellow)}
.blmap-zoom{position:absolute;right:12px;bottom:12px;display:flex;flex-direction:column;gap:6px;z-index:22}
/* filtros de camadas (estilo Google Maps pra corredores) */
.blmap-layers{position:absolute;top:10px;left:10px;right:10px;z-index:24;display:flex;gap:6px;overflow-x:auto;padding-bottom:2px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.blmap-layers::-webkit-scrollbar{display:none}
.blmap-lyr{background:rgba(10,11,13,.9);border:1px solid var(--line);color:#9aa0aa;border-radius:20px;padding:6px 12px;font-family:'Oswald',sans-serif;font-size:11.5px;cursor:pointer;backdrop-filter:blur(6px);transition:.12s;white-space:nowrap;flex:none}
.blmap-lyr.on{background:rgba(242,194,48,.16);border-color:var(--yellow);color:#fff}
.blmap-lyr:hover{border-color:var(--yellow)}
.blmap-radar.police .ic{border-color:#e6a417;color:#e6a417;background:rgba(230,164,23,.15)}
.blmap-radar.police .ring{border-color:rgba(230,164,23,.5)}
.blmap-pin.event .pt{border-color:#c084fc;color:#c084fc;box-shadow:0 0 12px rgba(192,132,252,.35)}
.blmap-zoom button{width:38px;height:38px;border-radius:10px;background:rgba(16,17,20,.95);border:1px solid var(--line);color:#fff;font-size:18px;cursor:pointer;transition:.12s}
.blmap-zoom button:hover{border-color:var(--yellow);color:var(--yellow)}
.blmap-racer-ov{position:fixed;inset:0;z-index:10175;background:rgba(0,0,0,.72);backdrop-filter:blur(4px);display:none;align-items:center;justify-content:center;padding:16px}
.blmap-racer-ov.on{display:flex}
.brc-box{background:#101216;border:1px solid var(--line);border-radius:16px;width:100%;max-width:340px;padding:22px;text-align:center;position:relative}
.brc-x{position:absolute;top:12px;right:12px;background:rgba(255,255,255,.06);border:none;color:#c3c7cf;width:30px;height:30px;border-radius:8px;cursor:pointer}
.brc-tag{display:inline-flex;align-items:center;gap:8px;background:linear-gradient(135deg,#1c1e26,#0d0e12);border:1.5px solid var(--yellow);border-radius:11px;padding:8px 16px;transform:skewX(-7deg);margin-bottom:8px}
.brc-tag .blmap-ic{width:22px;height:22px;color:var(--yellow);transform:none}.brc-tag .s{font-size:22px;color:var(--yellow)}.brc-tag .n{font-family:'Permanent Marker',cursive;font-size:19px}
.brc-sub{color:#9aa0aa;font-size:12.5px;margin-bottom:16px}
.brc-acts{display:flex;flex-direction:column;gap:8px}
.brc-acts button{padding:12px;border:none;border-radius:10px;font-family:'Oswald',sans-serif;font-weight:600;font-size:14px;cursor:pointer}
.brc-friend{background:var(--yellow);color:#111}.brc-chat{background:rgba(255,255,255,.08);color:#fff;border:1px solid var(--line)!important}.brc-race{background:var(--red);color:#fff}
.brc-note{color:#7a7f88;font-size:11px;margin-top:12px;line-height:1.5}
/* ===== SECTION LOCK + COUNTDOWN + LAUNCH ===== */
.seclock-ov{position:fixed;inset:0;z-index:10160;background:rgba(6,7,9,.96);backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;padding:20px}
.seclock-ov.on{display:flex}
.seclock-box{max-width:520px;text-align:center;background:linear-gradient(180deg,#15171b,#0a0b0d);border:1px solid rgba(242,194,48,.3);border-radius:20px;padding:38px 30px;box-shadow:0 30px 80px -12px #000}
.seclock-ic{font-size:52px;margin-bottom:10px}
.seclock-t{font-family:'Permanent Marker',cursive;font-size:34px;color:var(--yellow);text-shadow:0 0 20px rgba(242,194,48,.4)}
.seclock-m{color:#c3c7cf;font-size:15px;line-height:1.6;margin:12px auto 20px;max-width:400px}
.seclock-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:6px}
.seclock-btns button{background:var(--yellow);color:#111;border:none;border-radius:11px;padding:12px 22px;font-family:'Oswald';font-weight:600;font-size:14px;cursor:pointer}
.seclock-btns .gh{background:rgba(255,255,255,.08);color:#fff;border:1px solid var(--line)}
/* countdown */
.cd-wrap{margin:8px auto 22px}
.cd-lbl{font-size:12px;color:#9aa0aa;text-transform:uppercase;letter-spacing:2px;margin-bottom:10px}
.cd-boxes{display:flex;gap:10px;justify-content:center}
.cd-b{background:rgba(255,255,255,.04);border:1px solid rgba(242,194,48,.3);border-radius:12px;padding:12px 6px;min-width:66px}
.cd-b b{display:block;font-family:'Racing Sans One';font-size:30px;color:var(--yellow);line-height:1}
.cd-b span{font-size:10px;color:#9aa0aa;text-transform:uppercase;letter-spacing:1px}
/* lock toggles */
#lock-list .lock-row{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:10px;margin-bottom:7px;cursor:pointer}
#lock-list .lock-nm{font-size:14px;font-family:'Oswald'}
#lock-list .lock-tg{position:relative;width:42px;height:23px;flex:none}
#lock-list .lock-tg input{opacity:0;width:0;height:0;position:absolute}
#lock-list .lock-tg span{position:absolute;inset:0;background:rgba(255,255,255,.15);border-radius:20px;transition:.2s}
#lock-list .lock-tg span::before{content:'';position:absolute;width:17px;height:17px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s}
#lock-list .lock-tg input:checked+span{background:var(--red)}
#lock-list .lock-tg input:checked+span::before{transform:translateX(19px)}
/* modo por seção + pedidos */
#lock-list .lock-row2{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:10px;padding:10px 14px;margin-bottom:7px}
#lock-list .lock-r-top{display:flex;align-items:center;justify-content:space-between}
#lock-list .lock-mode{display:flex;gap:8px;margin-top:9px}
#lock-list .lock-mode.off{opacity:.4;pointer-events:none}
#lock-list .lk-m{flex:1;display:flex;align-items:center;gap:6px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:8px;padding:7px 10px;font-size:12px;cursor:pointer;color:#c3c7cf}
#lock-list .lk-m.sel{border-color:var(--yellow);background:rgba(242,194,48,.1);color:#fff}
#lock-list .lk-m input{accent-color:var(--yellow)}
#lock-reqs .lock-reqs-h{font-family:'Oswald',sans-serif;font-size:15px;color:var(--yellow);margin-bottom:10px;display:flex;gap:8px;align-items:center}
#lock-reqs .lock-reqs-h span{background:var(--red);color:#fff;font-size:11px;padding:2px 8px;border-radius:10px}
#lock-reqs .lock-req{display:flex;justify-content:space-between;align-items:center;gap:10px;background:rgba(242,194,48,.05);border:1px solid rgba(242,194,48,.25);border-radius:10px;padding:11px 13px;margin-bottom:7px}
#lock-reqs .lock-req b{font-family:'Oswald',sans-serif;font-size:14px}
#lock-reqs .lock-req span{display:block;font-size:11px;color:#9aa0aa}
#lock-reqs .lock-req-btns{display:flex;gap:6px;flex:none}
#lock-reqs .lr-ok{background:#2ec77a;color:#04220f;border:none;border-radius:8px;padding:8px 13px;font-family:'Oswald',sans-serif;font-weight:600;font-size:12px;cursor:pointer}
#lock-reqs .lr-no{background:rgba(255,255,255,.08);color:#c3c7cf;border:1px solid var(--line);border-radius:8px;padding:8px 13px;font-family:'Oswald',sans-serif;font-size:12px;cursor:pointer}
.seclock-pending{background:rgba(46,199,122,.1);border:1px solid rgba(46,199,122,.3);color:#a7e8c8;border-radius:12px;padding:14px 18px;font-size:13.5px;margin:6px auto 16px;max-width:400px;line-height:1.5}
/* launch admin */
#launch-admin .pay-sec{background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:14px;padding:16px;margin-bottom:14px}
#launch-admin .pay-sec-h b{display:block;font-family:'Oswald';font-size:16px;color:var(--yellow)}
#launch-admin .pay-sec-h span{display:block;color:#9aa0aa;font-size:12px;margin-top:2px}
#launch-admin .set-lbl{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:#bdbdbd;margin:12px 0 6px}
#launch-admin .set-in{width:100%;background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#fff;font-family:'Oswald';font-size:14px;padding:11px 12px;box-sizing:border-box}
#launch-admin textarea.set-in{resize:vertical}
#launch-admin .set-btn{margin-top:14px;background:var(--yellow);color:#111;border:none;border-radius:10px;padding:11px 22px;font-family:'Oswald';font-weight:600;font-size:14px;cursor:pointer}
#launch-admin .set-msg{margin-left:10px;font-size:13px;font-family:'Oswald'}
/* modal de solicitação de parceria */
.pa-ov{position:fixed;inset:0;z-index:10130;background:rgba(0,0,0,.72);backdrop-filter:blur(3px);display:none;align-items:flex-start;justify-content:center;padding:24px 16px;overflow-y:auto}
.pa-ov.on{display:flex}
.pa-box{background:#101013;border:1px solid rgba(255,255,255,.14);border-radius:16px;width:100%;max-width:520px;margin:auto;box-shadow:0 24px 60px -12px rgba(0,0,0,.8)}
.pa-h{display:flex;justify-content:space-between;align-items:center;padding:16px 18px;border-bottom:1px solid rgba(255,255,255,.1)}
.pa-h b{font-family:'Oswald',sans-serif;font-size:17px;color:var(--yellow)}
.pa-x{background:rgba(255,255,255,.06);border:none;color:#c3c7cf;font-size:24px;width:34px;height:34px;border-radius:9px;cursor:pointer}
.pa-body{padding:18px}
.pa-intro{color:#c3c7cf;font-size:13.5px;line-height:1.55;margin:0 0 14px}
.pa-lbl{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:#bdbdbd;margin:11px 0 5px}
.pa-in{width:100%;background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#fff;font-family:'Oswald',sans-serif;font-size:14px;padding:11px 12px;box-sizing:border-box}
.pa-in:focus{outline:none;border-color:var(--yellow)}
textarea.pa-in{resize:vertical;min-height:80px}
.pa-row{display:flex;gap:12px}.pa-row>div{flex:1}
.pa-note{margin-top:10px;font-size:13px;font-family:'Oswald',sans-serif}
.pa-submit{width:100%;margin-top:16px;background:var(--yellow);color:#111;border:none;border-radius:10px;padding:13px;font-family:'Oswald',sans-serif;font-weight:600;font-size:15px;cursor:pointer}
.pa-submit:hover{filter:brightness(1.08)}
.pa-small{color:#7a7f88;font-size:11.5px;text-align:center;margin-top:10px;line-height:1.4}
@media(max-width:640px){.pa-row{flex-direction:column;gap:0}}
/* solicitações no admin */
#partners-admin .pn-reqs{margin-bottom:8px}
#partners-admin .pn-req{background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:12px;padding:14px;margin-bottom:10px}
#partners-admin .pn-req-new{border-color:rgba(46,199,122,.4);background:rgba(46,199,122,.05)}
#partners-admin .pn-req-top{display:flex;align-items:center;gap:10px}
#partners-admin .pn-req-top b{font-family:'Oswald',sans-serif;font-size:15px;color:#fff}
#partners-admin .pn-req-badge{background:#2ec77a;color:#04220f;font-size:10px;padding:2px 8px;border-radius:10px;font-weight:bold}
#partners-admin .pn-req-meta{color:#9aa0aa;font-size:12.5px;margin:4px 0}
#partners-admin .pn-req-contact{font-size:13px;margin:4px 0}
#partners-admin .pn-req-contact a{color:var(--yellow);text-decoration:none}
#partners-admin .pn-req-msg{color:#c3c7cf;font-size:13px;line-height:1.5;background:rgba(0,0,0,.25);border-radius:8px;padding:10px;margin:8px 0}
#partners-admin .pn-req-actions{display:flex;gap:8px;flex-wrap:wrap}
#partners-admin .pn-req-btn{background:var(--yellow);color:#111;border:none;border-radius:8px;padding:8px 14px;font-family:'Oswald',sans-serif;font-size:12.5px;cursor:pointer;text-decoration:none}
#partners-admin .pn-req-btn2{background:rgba(255,255,255,.08);color:#fff;border:1px solid var(--line);border-radius:8px;padding:8px 14px;font-family:'Oswald',sans-serif;font-size:12.5px;cursor:pointer}
#partners-admin .pn-req-del{background:rgba(210,31,31,.15);color:#ff6b6b;border:1px solid rgba(210,31,31,.4);border-radius:8px;padding:8px 14px;font-family:'Oswald',sans-serif;font-size:12.5px;cursor:pointer}
@media(max-width:640px){#partners-admin .pn-row{flex-direction:column;gap:0}}
/* campos do painel Payments (mesmo estilo do Settings) */
#pay-panel .set-lbl{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:#bdbdbd;margin:12px 0 6px}
#pay-panel .set-opt{text-transform:none;letter-spacing:0;color:#7a7f88;font-size:10.5px}
#pay-panel .set-in{width:100%;background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#fff;font-family:'Oswald',sans-serif;font-size:14px;padding:11px 12px;box-sizing:border-box}
#pay-panel .set-in:focus{outline:none;border-color:var(--yellow)}
#pay-panel .set-row{display:flex;gap:12px;flex-wrap:wrap}
#pay-panel .set-row>div{flex:1;min-width:140px}
#pay-panel .set-btn{margin-top:16px;background:var(--yellow);color:#111;border:none;border-radius:10px;padding:12px 24px;font-family:'Oswald',sans-serif;font-weight:600;font-size:14px;cursor:pointer;transition:.15s}
#pay-panel .set-btn:hover{filter:brightness(1.08)}
#pay-panel .set-msg{margin-left:10px;font-size:13px;font-family:'Oswald',sans-serif}
#pay-panel .pm-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:8px;margin-top:8px}
#pay-panel .pm-item{display:flex;align-items:center;gap:9px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:10px;padding:11px 13px;font-size:13px;color:#dfe2e7;cursor:pointer;transition:.12s;font-family:'Oswald',sans-serif}
#pay-panel .pm-item:hover{border-color:var(--yellow)}
#pay-panel .pm-item input{width:17px;height:17px;flex:none;cursor:pointer;accent-color:var(--yellow)}
#pay-panel .pm-item .pm-ic{font-size:16px}
@media(max-width:640px){#pay-panel .set-row{flex-direction:column;gap:0}#pay-panel .set-row>div{min-width:0}#pay-panel .pm-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){#pay-panel .co-opts{grid-template-columns:1fr}}
#set-panel .co-opt b{display:block;font-size:13px;color:#fff;font-family:'Oswald',sans-serif}
#set-panel .co-opt small{display:block;color:#9aa0aa;font-size:11px;line-height:1.4;margin-top:2px}
@media(max-width:640px){#set-panel .co-opts{grid-template-columns:1fr}}
@media(max-width:820px){#set-panel{grid-template-columns:1fr}}
@media(max-width:640px){.bk-grid{grid-template-columns:1fr}}
/* box de banco do afiliado */
#aff-body .aff-bankbox{background:linear-gradient(180deg,rgba(46,199,122,.1),rgba(46,199,122,.02));border:1px solid rgba(46,199,122,.4);border-radius:12px;padding:16px 18px;margin:12px 0}
#aff-body .aff-bankbox-h{font-family:Oswald,sans-serif;font-weight:600;color:#7fe0aa;font-size:13px;text-transform:uppercase;letter-spacing:1px;margin-bottom:10px}
#aff-body .aff-bankrow{display:flex;justify-content:space-between;gap:14px;padding:7px 0;border-bottom:1px solid rgba(255,255,255,.07);font-size:14px}
#aff-body .aff-bankrow:last-child{border-bottom:none}
#aff-body .aff-bankrow span{color:#9aa0aa}
#aff-body .aff-bankrow b{color:#fff;font-family:Oswald,sans-serif;text-align:right;user-select:all}
#aff-body .aff-bankbox-empty{background:linear-gradient(180deg,rgba(230,164,23,.1),rgba(230,164,23,.02));border-color:rgba(230,164,23,.4);color:#e8d9b0;font-size:13px;line-height:1.6}
#aff-body .aff-bankbox-empty b{color:#fff}
.adm-field{display:flex;flex-direction:column}
/* Analytics */
.an-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:12px}
.an-kpi{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:12px;padding:16px;text-align:center}
.an-kpi .v{font-family:'Racing Sans One',sans-serif;font-size:26px;color:var(--yellow)}
.an-kpi .l{font-size:11px;color:#9aa0aa;text-transform:uppercase;letter-spacing:.5px;margin-top:4px}
.an-grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.an-grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.an-box{background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:14px;padding:16px}
.an-box-h{font-family:Oswald,sans-serif;font-weight:600;color:#fff;font-size:13px;text-transform:uppercase;letter-spacing:.5px;margin-bottom:10px}
.an-bars{display:flex;align-items:flex-end;gap:8px;height:120px}
.an-bar-col{flex:1;display:flex;flex-direction:column;align-items:center;height:100%;justify-content:flex-end}
.an-bar{width:100%;max-width:38px;background:linear-gradient(180deg,var(--yellow),#e6a417);border-radius:5px 5px 0 0;position:relative;min-height:3px;display:flex;justify-content:center}
.an-bar span{position:absolute;top:-16px;font-size:10px;color:#dfe2e7}
.an-bar-lbl{font-size:9px;color:#7a7f88;margin-top:4px}
.an-pie-wrap{display:flex;gap:14px;align-items:center;flex-wrap:wrap;justify-content:center}
.an-legend{display:flex;flex-direction:column;gap:4px;font-size:11.5px;color:#dfe2e7}
.an-leg{white-space:nowrap}.an-leg b{color:#fff}
.an-dot{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:5px;vertical-align:middle}
.an-secrow{display:flex;align-items:center;gap:10px;padding:5px 0}
.an-secname{width:150px;font-size:12.5px;color:#dfe2e7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.an-secbar{flex:1;height:8px;background:rgba(255,255,255,.06);border-radius:4px;overflow:hidden}
.an-secbar i{display:block;height:100%;background:var(--yellow);border-radius:4px}
.an-secn{font-size:12px;color:#9aa0aa;width:36px;text-align:right}
@media(max-width:820px){.an-grid4{grid-template-columns:1fr 1fr}.an-grid2{grid-template-columns:1fr}}
@media(max-width:640px){.an-kpis{grid-template-columns:1fr 1fr}.an-grid4{grid-template-columns:1fr}.an-secname{width:100px}}
.cc-tile{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:14px;padding:16px 14px;cursor:pointer;transition:.15s;text-align:center}
.cc-tile:hover{transform:translateY(-3px);border-color:var(--yellow)}
.cc-tile.hot{border-color:rgba(242,194,48,.6);background:linear-gradient(180deg,rgba(242,194,48,.1),rgba(242,194,48,.02))}
.cc-tile .cc-ic{font-size:22px;margin-bottom:4px}
.cc-tile .cc-n{font-family:'Racing Sans One',sans-serif;font-size:28px;color:#fff;line-height:1}
.cc-tile.hot .cc-n{color:var(--yellow)}
.cc-tile .cc-l{font-size:11px;color:#9aa0aa;text-transform:uppercase;letter-spacing:.5px;margin-top:4px}
.cc-feed{margin-top:10px;max-height:460px;overflow-y:auto;display:flex;flex-direction:column;gap:2px}
.cc-ev{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:10px;cursor:pointer;transition:.12s;border-bottom:1px solid rgba(255,255,255,.05)}
.cc-ev:hover{background:rgba(255,255,255,.04)}
.cc-ev-ic{font-size:18px;flex:none;width:26px;text-align:center}
.cc-ev-tx{flex:1;min-width:0}
.cc-ev-tx b{display:block;color:#fff;font-size:13.5px;font-family:Oswald,sans-serif}
.cc-ev-tx span{display:block;color:#9aa0aa;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-ev-t{color:#7a7f88;font-size:11px;flex:none;font-family:Oswald,sans-serif}
@media(max-width:640px){.cc-tiles{grid-template-columns:1fr 1fr}}
.adm-kpi{background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.01));border:1px solid var(--line);border-radius:12px;padding:16px}
.adm-kpi .n{font-family:'Racing Sans One';font-size:24px;color:var(--yellow);line-height:1.1}
.adm-kpi .l{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:1px;margin-top:4px}
.adm-kpi.red .n{color:#ff6b6b}.adm-kpi.green .n{color:#2ec77a}
.adm-table{width:100%;border-collapse:collapse;font-size:13px}
.adm-table th{text-align:left;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;font-size:11px;padding:8px 10px;border-bottom:1px solid var(--line)}
.adm-table td{padding:10px;border-bottom:1px solid rgba(255,255,255,.05);color:#ddd;vertical-align:middle}
.adm-table tr:hover td{background:rgba(255,255,255,.02)}
.adm-in,.adm-sel{background:linear-gradient(180deg,#1f1f22,#171719);border:1px solid rgba(255,255,255,.16);border-radius:7px;color:#fff;font-family:'Oswald';font-size:13px;padding:8px 10px;width:100%}
.adm-in:focus,.adm-sel:focus{outline:none;border-color:var(--yellow)}
.adm-btn{background:var(--yellow);border:none;border-radius:7px;color:#111;font-family:'Oswald';font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.5px;padding:8px 14px;cursor:pointer;white-space:nowrap}
.adm-btn:hover{background:#e0b02c}
.adm-btn.ghost{background:transparent;border:1px solid var(--line);color:#ddd}
.adm-btn.ghost:hover{border-color:var(--yellow);color:var(--yellow)}
.adm-btn.red{background:#D21F1F;color:#fff}.adm-btn.red:hover{background:#b81a1a}
.st-badge{display:inline-block;font-size:11px;padding:3px 9px;border-radius:20px;letter-spacing:.5px;text-transform:capitalize}
.st-processing{background:rgba(226,59,59,.15);color:#ff5a5a}
.st-confirmed{background:rgba(242,194,48,.15);color:#F2C230}
.st-received{background:rgba(46,199,122,.18);color:#2ec77a}
.st-returned{background:rgba(230,164,23,.18);color:#e6a417}
.st-cancelled{background:rgba(210,31,31,.15);color:#ff6b6b}
.st-saved{color:#2ec77a;font-size:11px;font-family:'Oswald',sans-serif;letter-spacing:.5px}
.st-shipped{background:rgba(46,199,122,.15);color:#2ec77a}
.st-completed{background:rgba(46,199,122,.15);color:#2ec77a}
.st-cancelled{background:rgba(210,31,31,.15);color:#ff6b6b}
.adm-chartwrap{position:relative;height:230px}
.adm-chartwrap canvas{width:100%;height:100%}
.adm-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.adm-grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.adm-grid2 .full{grid-column:1/-1}
.adm-lbl{display:block;font-size:11px;letter-spacing:1px;text-transform:uppercase;color:#bdbdbd;margin:0 0 6px}
textarea.adm-in{min-height:120px;resize:vertical;line-height:1.6}
.adm-cover{width:120px;height:213px;object-fit:cover;border-radius:10px;border:1px solid var(--line);background:#111;flex:none}
.adm-cover-ph{width:120px;height:213px;border-radius:10px;border:1px dashed rgba(255,255,255,.25);display:flex;align-items:center;justify-content:center;text-align:center;color:var(--muted);font-size:11px;padding:8px;flex:none}
/* Made-to-order painel */
.adm-card-h2{font-family:Oswald,sans-serif;font-weight:600;color:#fff;font-size:15px;margin:0 0 10px;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.1);text-transform:uppercase;letter-spacing:.5px}
/* botões de ação (olho, pdf, fatura) */
.ab-eye,.ab-pdf,.ab-inv{border:none;border-radius:8px;width:34px;height:32px;cursor:pointer;font-size:15px;transition:.15s;vertical-align:middle}
.ab-eye{background:rgba(56,164,255,.18);color:#8fd0ff}.ab-eye:hover{background:#38a4ff;color:#fff;transform:translateY(-1px)}
.ab-pdf{background:rgba(242,194,48,.18);color:#F2C230}.ab-pdf:hover{background:var(--yellow);color:#111;transform:translateY(-1px)}
.ab-inv{background:rgba(46,199,122,.18);color:#2ec77a}.ab-inv:hover{background:#2ec77a;color:#fff;transform:translateY(-1px)}
.ab-eye,.ab-pdf,.ab-inv,.ab-fac{border:none;border-radius:8px;width:34px;height:32px;cursor:pointer;font-size:15px;transition:.15s;vertical-align:middle;margin:0 3px 4px 0}
@media(max-width:640px){.ab-eye,.ab-pdf,.ab-inv,.ab-fac{width:38px;height:38px;margin:0 5px 6px 0}}
.ab-fac{background:rgba(210,31,31,.18);color:#ff8a8a}.ab-fac:hover{background:var(--red);color:#fff;transform:translateY(-1px)}
/* modal de detalhes admin */
#admdetail-ov .admd-head{border-bottom:2px solid var(--yellow);padding-bottom:12px;margin-bottom:14px}
#admdetail-ov .admd-eyebrow{color:var(--yellow);font-family:Oswald,sans-serif;text-transform:uppercase;letter-spacing:2px;font-size:11px}
#admdetail-ov .admd-title{font-family:'Racing Sans One',sans-serif;color:#fff;font-size:22px;margin:2px 0 8px}
#admdetail-ov .admd-cust{background:rgba(255,255,255,.04);border-radius:10px;padding:12px 14px;margin-bottom:14px;color:#dfe2e7;font-size:13.5px}
#admdetail-ov .admd-cust b{color:#fff}
#admdetail-ov .admd-tbl{width:100%;border-collapse:collapse;margin-bottom:14px}
#admdetail-ov .admd-tbl td{padding:8px 10px;border-bottom:1px solid rgba(255,255,255,.08);font-size:13.5px;color:#dfe2e7}
#admdetail-ov .admd-tbl td:first-child{color:#9aa0aa;width:42%;font-weight:600}
#admdetail-ov .admd-acts{display:flex;gap:8px;flex-wrap:wrap}
/* specs de imagem */
.img-specs{margin-top:10px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:8px;padding:10px 12px;font-size:10.5px;color:#9aa0aa;line-height:1.7;max-width:230px}
.img-specs-t{color:var(--yellow);font-family:Oswald,sans-serif;font-weight:600;font-size:11px;margin-bottom:4px}
.img-specs b{color:#dfe2e7}
/* SEO score */
.adv-app{max-width:1000px;margin:26px auto 0}
.adv-step{margin-bottom:34px}
/* migalhas (resumo do que foi escolhido, com botão trocar) */
.adv-crumbs{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin:0 auto 24px;max-width:900px}
.adv-crumb{display:inline-flex;align-items:center;gap:8px;background:rgba(242,194,48,.08);border:1px solid rgba(242,194,48,.4);border-radius:12px;padding:8px 14px;cursor:pointer;transition:.15s;font-family:'Oswald',sans-serif}
.adv-crumb:hover{background:rgba(242,194,48,.16);border-color:var(--yellow)}
.adv-crumb .adv-crumb-l{font-size:10px;text-transform:uppercase;letter-spacing:1px;color:#9aa0aa}
.adv-crumb b{color:#fff;font-size:14px}
.adv-crumb .adv-crumb-x{font-size:10px;text-transform:uppercase;letter-spacing:.5px;color:var(--yellow);border:1px solid rgba(242,194,48,.4);border-radius:8px;padding:2px 8px}
@media(max-width:640px){.adv-crumbs{gap:6px;margin-bottom:16px}.adv-crumb{padding:6px 10px}.adv-crumb b{font-size:12px}}
.adv-q{font-family:'Oswald',sans-serif;color:#fff;font-size:13px;text-transform:uppercase;letter-spacing:2px;margin-bottom:16px;display:flex;align-items:center;justify-content:center;gap:10px;text-align:center}
.adv-q .n{width:26px;height:26px;border-radius:50%;background:var(--yellow);color:#111;font-size:13px;display:flex;align-items:center;justify-content:center;font-weight:700;flex:none}
.adv-opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;max-width:900px;margin:0 auto}
.adv-opt{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:14px;padding:20px 18px;cursor:pointer;transition:.18s;text-align:center;color:#cfcfcf;position:relative;overflow:hidden}
/* cards com imagem de fundo (níveis + objetivos) */
.adv-opt.has-img{background-size:cover;background-position:center;min-height:130px;display:flex;flex-direction:column;justify-content:flex-end;text-align:left;padding:14px 16px;color:#fff}
.adv-opt.has-img .adv-opt-grad{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,8,10,.15) 20%,rgba(8,8,10,.55) 55%,rgba(8,8,10,.92));z-index:1}
.adv-opt.has-img .t,.adv-opt.has-img .d{position:relative;z-index:2}
.adv-opt.has-img .t{font-size:16px;text-shadow:0 2px 10px rgba(0,0,0,.8)}
.adv-opt.has-img .d{opacity:.9}
.adv-opt.has-img:hover{border-color:var(--yellow);transform:translateY(-3px);box-shadow:0 14px 34px -14px rgba(0,0,0,.8)}
.adv-opt.has-img.on{border-color:var(--yellow);box-shadow:0 0 0 2px var(--yellow),0 14px 34px -12px rgba(242,194,48,.6)}
.adv-opt.has-img.on .adv-opt-grad{background:linear-gradient(180deg,rgba(242,194,48,.1) 20%,rgba(8,8,10,.5) 55%,rgba(8,8,10,.9))}
.adv-opt.has-img.on .t{color:var(--yellow)}
.adv-opt::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(242,194,48,.08),transparent);opacity:0;transition:.18s}
.adv-opt:hover{border-color:rgba(242,194,48,.6);transform:translateY(-3px)}
.adv-opt:hover::before{opacity:1}
.adv-opt.on{background:var(--yellow);color:#111;border-color:var(--yellow);box-shadow:0 12px 30px -14px rgba(242,194,48,.7)}
.adv-opt .t{font-family:'Oswald',sans-serif;font-weight:600;font-size:16px;display:block;position:relative}
.adv-opt .d{font-size:12px;opacity:.75;margin-top:5px;display:block;position:relative;line-height:1.4}
.adv-def{background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.01));border:1px solid var(--line);border-radius:16px;padding:26px 28px;margin-bottom:16px;max-width:900px;margin-left:auto;margin-right:auto}
/* introdução adaptada ao nível */
.adv-levelintro{display:flex;gap:14px;align-items:flex-start;max-width:900px;margin:0 auto 16px;border-radius:16px;padding:18px 22px;line-height:1.7;font-size:14px}
.adv-levelintro .adv-lvl-ic{font-size:24px;flex:none}
.adv-levelintro b{display:block;font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:1px;font-size:13px;margin-bottom:4px}
.adv-levelintro span{color:#c3c7cf}
.adv-lvl-beginner{background:linear-gradient(180deg,rgba(46,199,122,.12),rgba(46,199,122,.02));border:1px solid rgba(46,199,122,.4)}
.adv-lvl-beginner b{color:#2ec77a}
.adv-lvl-enthusiast{background:linear-gradient(180deg,rgba(242,194,48,.12),rgba(242,194,48,.02));border:1px solid rgba(242,194,48,.4)}
.adv-lvl-enthusiast b{color:var(--yellow)}
.adv-lvl-mechanic{background:linear-gradient(180deg,rgba(56,164,255,.12),rgba(56,164,255,.02));border:1px solid rgba(56,164,255,.4)}
.adv-lvl-mechanic b{color:#8fd0ff}
.adv-lvl-specialist{background:linear-gradient(180deg,rgba(210,31,31,.14),rgba(210,31,31,.02));border:1px solid rgba(210,31,31,.45)}
.adv-lvl-specialist b{color:#ff8a8a}
.adv-goal-banner{max-width:900px;margin:0 auto 16px;border-radius:16px;overflow:hidden;position:relative;line-height:0;border:1px solid var(--line)}
.adv-goal-banner img{width:100%;height:auto;display:block;aspect-ratio:1920/440;object-fit:cover;min-height:180px}
.adv-inside{max-width:900px;margin:0 auto 16px;border-radius:16px;overflow:hidden;line-height:0;border:1px solid var(--line);position:relative}
.adv-inside img{width:100%;height:auto;display:block;aspect-ratio:1920/1080;object-fit:cover}
.adv-inside::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 70%,rgba(8,8,10,.4));pointer-events:none}
.adv-goal-banner-tx{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:'Racing Sans One',cursive;color:#fff;font-size:clamp(34px,6vw,64px);text-shadow:0 4px 30px rgba(0,0,0,.95),0 2px 8px rgba(0,0,0,.9);z-index:2;text-align:center;padding:0 20px;letter-spacing:1px}
.adv-goal-banner::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(8,8,10,.55) 0%,rgba(8,8,10,.35) 45%,rgba(8,8,10,.75) 100%)}
.adv-def-h{font-family:'Racing Sans One',cursive;color:var(--yellow);font-size:22px;margin-bottom:10px;text-align:center}
.adv-def p{color:#c3c7cf;font-size:14.5px;line-height:1.8;margin:0;text-align:center}
.adv-inc{margin-top:18px;color:#dfe2e7;font-size:14px;max-width:560px;margin-left:auto;margin-right:auto}
.adv-inc b{color:#fff;display:block;text-align:center;margin-bottom:8px;font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:1px;font-size:12px}
.adv-inc ul{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.adv-inc li{color:#b7bcc4;line-height:1.5;padding:9px 14px;background:rgba(255,255,255,.03);border-radius:9px;border-left:2px solid var(--yellow);font-size:13.5px}
.adv-tip{display:flex;gap:14px;align-items:flex-start;background:linear-gradient(180deg,rgba(242,194,48,.1),rgba(242,194,48,.02));border:1px solid rgba(242,194,48,.35);border-radius:16px;padding:20px 22px;margin:0 auto 16px;max-width:900px;color:#e8e2cf;font-size:14px;line-height:1.75}
.adv-tip .adv-tip-ic{font-size:24px;flex:none}
.adv-tip b{color:var(--yellow)}
.adv-result{margin:0 auto;max-width:900px;background:rgba(255,255,255,.02);border:1px solid rgba(242,194,48,.25);border-radius:16px;padding:26px 28px}
.adv-result h3{font-family:'Racing Sans One',cursive;color:var(--yellow);font-size:24px;margin:0 0 6px;text-align:center}
.adv-result>p{text-align:center}
.adv-part{display:flex;gap:16px;align-items:flex-start;padding:18px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.adv-part:last-of-type{border-bottom:none}
.adv-part .ic{width:48px;height:48px;flex:none;border-radius:12px;background:linear-gradient(180deg,rgba(242,194,48,.16),rgba(242,194,48,.04));border:1px solid rgba(242,194,48,.25);display:flex;align-items:center;justify-content:center}
.adv-part .ic svg{width:30px;height:28px}
.adv-part .info{flex:1;min-width:0}
.adv-part .pt{font-family:'Oswald',sans-serif;font-weight:600;color:#fff;font-size:16px}
.adv-part .pd{font-size:13.5px;color:#9aa0aa;line-height:1.5;margin:4px 0 10px}
.adv-part .brands{display:flex;gap:7px;flex-wrap:wrap}
.adv-part .bchip{background:rgba(255,255,255,.06);border:1px solid var(--line);border-radius:16px;padding:6px 14px;font-size:12px;color:#dfe2e7;cursor:pointer;transition:.15s;font-family:'Oswald',sans-serif}
.adv-part .bchip:hover{border-color:var(--yellow);color:var(--yellow);transform:translateY(-1px)}
.adv-part .bchip.see{background:rgba(242,194,48,.14);border-color:rgba(242,194,48,.45);color:var(--yellow);font-weight:600}
.adv-part .bchip.see:hover{background:var(--yellow);color:#111}
/* carrossel de marcas */
.adv-brands-wrap{max-width:900px;margin:16px auto 0}
.adv-brands-t{text-align:center;font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:1.5px;font-size:12px;color:#9aa0aa;margin-bottom:12px}
.adv-brands{display:flex;gap:12px;overflow-x:auto;padding:6px 4px 12px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.adv-brands::-webkit-scrollbar{display:none}
.adv-brand-card{flex:0 0 160px;scroll-snap-align:start;background:#fff;border-radius:14px;padding:20px 18px;cursor:pointer;transition:.18s;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid transparent;height:96px}
.adv-brand-card:hover{transform:translateY(-4px);border-color:var(--yellow);box-shadow:0 16px 36px -14px rgba(242,194,48,.55)}
.adv-brand-card img{max-width:100%;max-height:100%;object-fit:contain}
.adv-brand-card .bn{font-family:'Racing Sans One',cursive;font-size:16px;color:#111;text-align:center;letter-spacing:.3px}
.adv-brand-card.noimg{background:linear-gradient(160deg,#1c1c20,#0e0e11);border:1px solid rgba(242,194,48,.3)}
.adv-brand-card.noimg .bn{color:var(--yellow)}
.adv-brands-swipe{text-align:center;color:#7a7f88;font-family:'Oswald',sans-serif;font-size:10.5px;letter-spacing:1px;text-transform:uppercase;margin-top:2px}
.adv-dyno{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;background:linear-gradient(180deg,rgba(56,164,255,.12),rgba(56,164,255,.03));border:1px solid rgba(56,164,255,.4);border-radius:14px;padding:18px 22px;margin-top:18px}
.adv-dyno b{color:#8fd0ff;font-family:'Oswald',sans-serif}
.adv-dyno-btn{background:#38a4ff;color:#04121f;border:none;border-radius:10px;padding:13px 22px;font-family:'Oswald',sans-serif;font-weight:600;font-size:14px;cursor:pointer;transition:.15s;white-space:nowrap}
.adv-dyno-btn:hover{filter:brightness(1.1);transform:translateY(-2px)}
.adv-manual{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;background:linear-gradient(180deg,rgba(242,194,48,.1),rgba(242,194,48,.02));border:1px solid rgba(242,194,48,.4);border-radius:14px;padding:18px 22px;margin-top:18px}
.adv-manual b{color:var(--yellow);font-family:'Oswald',sans-serif}
.adv-manual-btn{background:var(--yellow);color:#111;border:none;border-radius:10px;padding:13px 22px;font-family:'Oswald',sans-serif;font-weight:600;font-size:14px;cursor:pointer;transition:.15s;white-space:nowrap}
.adv-manual-btn:hover{filter:brightness(1.05);transform:translateY(-2px)}
@media(max-width:640px){.adv-manual{flex-direction:column;align-items:flex-start}.adv-manual-btn{width:100%}}
.adv-note{margin-top:18px;font-size:12px;color:#8a8f98;line-height:1.7;text-align:center;padding-top:16px;border-top:1px solid rgba(255,255,255,.08)}
.dyno-toguide{display:none;background:rgba(242,194,48,.12);border:1px solid rgba(242,194,48,.4);border-radius:10px;padding:12px 16px;margin:0 auto 16px;max-width:640px;text-align:center;color:#e8e2cf}
.dyno-toguide.on{display:block}
.dyno-toguide button{background:var(--yellow);color:#111;border:none;border-radius:8px;padding:9px 18px;font-family:'Oswald',sans-serif;font-weight:600;cursor:pointer;margin-left:8px}
@media(max-width:640px){.adv-opts{grid-template-columns:1fr 1fr;gap:8px}.adv-opt{padding:14px 10px}.adv-def,.adv-tip,.adv-result{padding:18px 16px}.adv-brand-card{flex:0 0 132px;height:86px}.adv-part{gap:12px}.adv-part .ic{width:42px;height:42px}.adv-part .ic svg{width:26px;height:24px}.adv-part .pt{font-size:15px}.adv-dyno{flex-direction:column;align-items:flex-start;gap:10px}.adv-dyno-btn{width:100%}}
/* banner de vídeo do Expert Guide (1920x400) */
#cat-advisor .eg-banner{width:100%;max-width:1400px;margin:0 auto 8px;border-radius:0 0 16px 16px;overflow:hidden;line-height:0;background:#000}
#cat-advisor .eg-banner video{width:100%;height:auto;display:block;aspect-ratio:1920/400;object-fit:cover}
#cat-advisor .section-body{padding-top:20px}
@media(max-width:640px){#cat-advisor .eg-banner{border-radius:0 0 12px 12px}#cat-advisor .section-body{padding-top:14px}}
/* modal de boas-vindas (quer ajuda?) */
.wlc-btn{display:flex;align-items:center;gap:14px;text-align:left;padding:16px 18px;border-radius:14px;cursor:pointer;transition:.18s;border:1px solid var(--line);background:rgba(255,255,255,.03);color:#fff;width:100%}
.wlc-btn:hover{transform:translateY(-2px)}
.wlc-btn .wlc-ic{font-size:26px;flex:none}
.wlc-btn .wlc-tx{display:flex;flex-direction:column;gap:3px}
.wlc-btn .wlc-tx b{font-family:'Oswald',sans-serif;font-size:16px}
.wlc-btn .wlc-tx small{color:#9aa0aa;font-size:12.5px;line-height:1.45;font-weight:400}
.wlc-yes{border-color:rgba(242,194,48,.5);background:linear-gradient(180deg,rgba(242,194,48,.12),rgba(242,194,48,.03))}
.wlc-yes:hover{border-color:var(--yellow);box-shadow:0 10px 30px -12px rgba(242,194,48,.5)}
.wlc-yes .wlc-tx b{color:var(--yellow)}
.wlc-no:hover{border-color:#fff}
.wlc-btn.kb-sel{border-color:var(--yellow) !important;box-shadow:0 0 0 2px var(--yellow),0 12px 30px -12px rgba(242,194,48,.5)}
.seo-bar{height:8px;border-radius:5px;background:#222;overflow:hidden;margin:8px 0}
.seo-bar > i{display:block;height:100%;transition:.3s;border-radius:5px}
.seo-checks{list-style:none;margin:8px 0 0;padding:0;font-size:12px}
.seo-checks li{padding:3px 0;color:#cfcfcf;display:flex;gap:8px;align-items:flex-start}
.seo-checks li::before{content:"";width:10px;height:10px;border-radius:50%;flex:none;margin-top:4px}
.seo-checks li.ok::before{background:#2ec77a}.seo-checks li.warn::before{background:var(--yellow)}.seo-checks li.bad::before{background:#ff6b6b}
/* artigos públicos (News) */
.news-cats{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:24px auto 0;max-width:900px}
.news-cat{background:rgba(255,255,255,.04);border:1px solid var(--line);color:#cfcfcf;padding:8px 16px;border-radius:20px;font-family:'Oswald';font-size:13px;letter-spacing:.5px;text-transform:uppercase;cursor:pointer;transition:.15s}
.news-cat:hover{border-color:var(--yellow);color:#fff}
.news-cat.on{background:var(--yellow);color:#111;border-color:var(--yellow);font-weight:600}
.news-grid{max-width:1200px;margin:26px auto 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:20px}
/* ===== CARROSSEL DE DESTAQUE (News) ===== */
.news-carousel{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;max-width:1100px;margin:20px auto 0;padding:4px;position:relative;scrollbar-width:none}
.news-carousel::-webkit-scrollbar{display:none}
.nc-slide{flex:0 0 min(88%,640px);scroll-snap-align:center;aspect-ratio:16/7;border-radius:14px;background-size:cover;background-position:center;position:relative;cursor:pointer;overflow:hidden;background-color:#111;border:1px solid var(--line)}
.nc-slide-grad{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 30%,rgba(0,0,0,.85) 100%)}
.nc-slide-tx{position:absolute;left:0;right:0;bottom:0;padding:18px 20px;z-index:2}
.nc-slide-cat{color:var(--yellow);font-family:'Oswald';font-size:11px;letter-spacing:1px;text-transform:uppercase;margin-bottom:4px}
.nc-slide-title{color:#fff;font-family:'Racing Sans One',cursive;font-size:clamp(16px,2.4vw,24px);line-height:1.15}
.nc-dots{position:sticky;right:0;display:none}
.news-carousel .nc-dots{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);display:flex;gap:6px;z-index:3}
.nc-dot{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.4);cursor:pointer;transition:.2s}
.nc-dot.on{background:var(--yellow);width:20px;border-radius:4px}
/* cards menores + landscape (não mais 9:16 gigante) */
.news-card .nc-cover{width:100%;aspect-ratio:16/10 !important;object-fit:cover;display:block;background:#111}
@media(max-width:820px){
  .news-carousel{margin-top:14px}
  .nc-slide{flex:0 0 90%;aspect-ratio:16/8}
  /* grid de artigos: 2 colunas que quebram, SEM rolar pro lado */
  .news-grid{display:grid !important;grid-template-columns:1fr 1fr !important;gap:10px;overflow:visible !important;padding-bottom:0}
  .news-card{flex:none !important;width:auto !important}
  .news-card .nc-cover{aspect-ratio:16/10 !important}
  .news-card .nc-title{font-size:13px}
}
@media(max-width:640px){
  #cat-news .sec-title{font-size:clamp(26px,8vw,40px)}
  .news-cats{gap:6px;margin-top:16px}
  .news-cat{font-size:11px;padding:6px 12px}
  .news-card{flex:0 0 150px !important}
  .news-card .nc-title{font-size:12px;line-height:1.25}
  .news-card .nc-body{padding:8px}
  .news-card .nc-tag,.news-card .nc-date{font-size:9px}
}
.news-card{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:14px;overflow:hidden;cursor:pointer;transition:.2s;text-align:left}
.news-card:hover{border-color:var(--yellow);transform:translateY(-4px)}
.news-card .nc-cover{width:100%;aspect-ratio:720/1280;object-fit:cover;display:block;background:#111}
.news-card .nc-body{padding:14px}
.news-card .nc-cat{font-size:11px;color:var(--yellow);text-transform:uppercase;letter-spacing:1px}
.news-card .nc-title{font-family:'Oswald';font-weight:600;color:#fff;font-size:16px;margin:5px 0 4px;line-height:1.25}
.news-card .nc-date{font-size:12px;color:var(--muted)}
.news-empty{grid-column:1/-1;text-align:center;padding:40px 20px}
/* log de atividades (quadro arrastável) */
.adm-logbox{max-height:230px;overflow-y:auto;border:1px solid var(--line);border-radius:10px;background:rgba(0,0,0,.25)}
.adm-logbox::-webkit-scrollbar{width:8px}.adm-logbox::-webkit-scrollbar-thumb{background:rgba(242,194,48,.35);border-radius:4px}
.log-item{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:10px 14px;border-bottom:1px solid rgba(255,255,255,.05);font-size:13px}
.log-item:last-child{border-bottom:none}
.log-a{color:#e6e6e6}
.log-d{color:var(--muted);font-size:11px;white-space:nowrap;font-family:'Oswald'}
.log-empty{padding:22px;text-align:center;color:var(--muted);font-size:13px}
.char-count{font-size:11px;color:var(--muted);margin-top:5px;font-family:'Oswald';letter-spacing:.5px;text-align:right}
.trk-cell{min-width:340px}
.trk-row{display:flex;align-items:center;gap:6px;margin-bottom:5px}
.trk-row:last-child{margin-bottom:0}
.trk-lbl{font-size:10px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);width:64px;flex:none}
.trk-c{width:100px!important;flex:none;padding:6px 8px!important}
.trk-u{flex:1;padding:6px 8px!important}
/* pedidos do cliente: link de rastreio + fatura */
.oi-track{margin-top:6px;display:flex;flex-wrap:wrap;gap:8px}
.oi-track a{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:#4aa3ff;text-decoration:none;background:rgba(74,163,255,.1);border:1px solid rgba(74,163,255,.3);padding:4px 10px;border-radius:16px}
.oi-track a:hover{background:rgba(74,163,255,.2)}
.oi-track a.inv{color:var(--yellow);background:rgba(242,194,48,.1);border-color:rgba(242,194,48,.35)}
/* busca de marca no hub */
.veh-search{max-width:560px;margin:22px auto 0;position:relative}
.veh-search input{width:100%;padding:14px 18px 14px 44px;background:linear-gradient(180deg,#1f1f22,#141416);
  border:1px solid rgba(255,255,255,.16);border-radius:10px;color:#fff;font-family:'Oswald';font-size:15px;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.veh-search input:focus{outline:none;border-color:var(--yellow);box-shadow:0 0 0 3px rgba(242,194,48,.18)}
.veh-search::before{content:"⌕";position:absolute;left:15px;top:50%;transform:translateY(-50%);color:var(--yellow);font-size:20px}
.veh-search-note{text-align:center;color:var(--muted);font-size:12px;margin-top:8px;letter-spacing:.5px}
.model-chips{max-width:1000px;margin:34px auto 0;display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.model-chips-title{max-width:1000px;margin:40px auto 6px;text-align:center;color:var(--yellow);text-transform:uppercase;letter-spacing:1.5px;font-size:12px;font-weight:700}
.model-chip{background:rgba(255,255,255,.04);border:1px solid var(--line);color:#cfcfcf;padding:9px 16px;border-radius:30px;font-size:13px;font-weight:600;cursor:pointer;transition:.15s;font-family:inherit}
.model-chip:hover{border-color:var(--red);color:#fff}
.model-chip.active{background:var(--red);border-color:var(--red);color:#fff}
.prod-filter h3{font-family:'Racing Sans One',cursive;font-size:22px;color:#fff;text-transform:uppercase;margin-bottom:6px;text-align:center}
.prod-filter .fsub{text-align:center;color:var(--muted);font-size:13px;margin-bottom:24px}
.filter-search{position:relative;margin-bottom:18px}
.filter-search input{width:100%;padding:15px 18px 15px 46px;background:#0e0e0e;border:1px solid var(--line);border-radius:8px;color:#fff;font-family:'Oswald';font-size:15px;transition:.2s}
.filter-search input:focus{outline:none;border-color:var(--red)}
.filter-search::before{content:"⌕";position:absolute;left:16px;top:50%;transform:translateY(-50%);color:var(--red);font-size:22px}
.filter-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.filter-field label{display:block;font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--muted);margin-bottom:6px;font-weight:600}
.filter-field select,.filter-field input{width:100%;padding:12px 14px;background:#0e0e0e;border:1px solid var(--line);border-radius:8px;color:#fff;font-family:'Oswald';font-size:14px;transition:.2s}
.filter-field select:focus,.filter-field input:focus{outline:none;border-color:var(--red)}
.filter-field select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238f8f8f' fill='none' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}
.filter-actions{display:flex;gap:12px;margin-top:20px;justify-content:center;flex-wrap:wrap}
/* contador de produtos no topo do quadro do filtro */
.filter-count{margin-top:18px;text-align:center;font-size:13px;color:#e8e8e8;letter-spacing:.3px;
  padding:10px 16px;background:rgba(242,194,48,.08);border:1px solid rgba(242,194,48,.35);border-radius:8px;
  display:flex;align-items:center;justify-content:center;gap:8px}
.filter-count strong{color:var(--yellow);font-weight:700}
.filter-count .fc-dot{width:8px;height:8px;border-radius:50%;background:var(--yellow);box-shadow:0 0 8px var(--yellow);flex:0 0 auto}
.filter-btn{padding:13px 34px;border-radius:8px;font-family:'Oswald';font-weight:600;font-style:italic;text-transform:uppercase;letter-spacing:1px;font-size:14px;cursor:pointer;border:0;transition:.2s}
.filter-btn.apply{background:var(--red);color:#fff}
.filter-btn.apply:hover{background:#b01818;transform:translateY(-2px)}
.filter-btn.clear{background:transparent;border:1px solid var(--line);color:var(--muted)}
.filter-btn.clear:hover{border-color:#fff;color:#fff}
@media(max-width:700px){.filter-grid{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.filter-grid{grid-template-columns:1fr}}
/* barra de subdivisão interna (usada na marca HEL: Brakelines / Oil Coolers) */
.sub-tabs{max-width:1000px;margin:34px auto 0;display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.sub-tabs .sub-tab-lbl{width:100%;text-align:center;color:var(--muted);text-transform:uppercase;letter-spacing:2px;font-size:11px;font-weight:600;margin-bottom:4px}
.sub-tab{background:rgba(255,255,255,.03);border:1px solid var(--line);color:#cfcfcf;padding:12px 26px;border-radius:8px;font-family:'Oswald';font-weight:600;font-style:italic;text-transform:uppercase;letter-spacing:1px;font-size:14px;cursor:pointer;transition:.18s}
.sub-tab:hover{border-color:var(--yellow);color:#fff}
.sub-tab.active{background:var(--yellow);border-color:var(--yellow);color:#111;box-shadow:0 8px 24px -8px rgba(242,194,48,.55)}
@media(max-width:480px){.sub-tab{flex:1 1 100%;text-align:center}}

/* split imagem esquerda + texto direita */
.brand-split{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center;margin:36px 0 10px}
.brand-split-img{border-radius:12px;overflow:hidden;border:1px solid var(--line);box-shadow:0 20px 60px -20px rgba(0,0,0,.8)}
.brand-split-img img{width:100%;height:auto;display:block}
.brand-logo-pad{background:#0d0d0d;display:flex;align-items:center;justify-content:center;padding:38px}
.brand-logo-pad img{width:auto;max-width:80%;max-height:230px;margin:auto}
.brand-split-text p{color:#cfcfcf;font-size:16px;line-height:1.7;margin-bottom:16px}
.brand-split-text strong{color:#fff;font-weight:600}
@media(max-width:800px){.brand-split{grid-template-columns:1fr;gap:24px}}

/* tabela de produtos */
.prod-table-wrap{max-width:1000px;margin:24px auto 0;max-height:520px;overflow-y:auto;overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:12px}
.prod-table{width:100%;border-collapse:collapse;font-size:14px;min-width:720px}
.prod-table thead th{background:#161616;color:var(--yellow);text-transform:uppercase;letter-spacing:.5px;font-size:11px;font-weight:600;padding:14px 16px;text-align:left;border-bottom:2px solid var(--red);position:sticky;top:0;z-index:2}
.prod-table tbody td{padding:13px 16px;border-bottom:1px solid var(--line);color:#cfcfcf}
.prod-table tbody tr{transition:.15s}
.prod-table tbody tr:hover{background:rgba(255,255,255,.03)}
.prod-table .pn{font-family:monospace;color:#8f8f8f;font-size:13px}
.prod-table .pdesc{color:#fff;font-weight:500}
.prod-table .pprice{color:var(--yellow);font-weight:600;white-space:nowrap}
.prod-table .pstock{display:inline-block;background:rgba(37,211,102,.12);color:#25D366;font-size:11px;font-weight:600;padding:3px 10px;border-radius:20px;white-space:nowrap}
.prod-table .pstock.ready{background:rgba(37,211,102,.14);color:#25D366}
.prod-table .pstock.made{background:rgba(242,194,48,.14);color:var(--yellow)}
.prod-table .th-view{text-align:center}
.view-btn{display:inline-flex;flex-direction:column;align-items:center;gap:3px;background:none;border:none;cursor:pointer;padding:0;font-family:inherit}
.view-btn img{width:54px;height:36px;object-fit:cover;border-radius:6px;border:1px solid var(--line);transition:.15s}
.view-btn span{font-size:10px;color:var(--yellow);text-transform:uppercase;letter-spacing:.5px;font-weight:600}
.view-btn:hover img{border-color:var(--red);transform:scale(1.05)}
.pview{text-align:center}
#blp-lightbox{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center}
#blp-lightbox.open{display:flex}
.blp-lb-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.88);backdrop-filter:blur(4px)}
.blp-lb-inner{position:relative;z-index:2;max-width:90vw;max-height:90vh;display:flex;flex-direction:column;align-items:center;gap:14px}
.blp-lb-img{max-width:90vw;max-height:78vh;object-fit:contain;border-radius:12px;border:1px solid var(--line);box-shadow:0 30px 80px -20px rgba(0,0,0,.9)}
.blp-lb-cap{color:#cfcfcf;font-size:14px;text-align:center;max-width:640px}
.blp-lb-cap strong{color:var(--yellow);font-family:monospace}
.blp-lb-close{position:absolute;top:-14px;right:-14px;width:40px;height:40px;border-radius:50%;background:var(--red);color:#fff;border:none;font-size:24px;cursor:pointer;line-height:1;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px rgba(0,0,0,.5)}
.prod-note{text-align:center;color:var(--muted);font-size:12px;padding:14px 16px;background:#0e0e0e}
.prod-empty{text-align:center;color:var(--muted);padding:30px;font-style:italic}
.coming-soon{padding:36px 24px;text-align:center;background:linear-gradient(180deg,rgba(242,194,48,.06),rgba(0,0,0,.15));border:1px dashed var(--yellow);border-radius:12px;font-style:normal}
.coming-soon .cs-badge{display:inline-block;background:var(--yellow);color:#1a1a1a;font-family:'Racing Sans One',cursive;font-size:14px;letter-spacing:1px;text-transform:uppercase;padding:6px 16px;border-radius:20px;margin-bottom:16px}
.coming-soon h3{font-family:'Racing Sans One',cursive;font-size:26px;color:#fff;text-transform:uppercase;letter-spacing:1px;margin:0 0 12px}
.coming-soon p{max-width:560px;margin:0 auto 8px;color:#ddd;line-height:1.6;font-size:15px}
.coming-soon .cs-sub{color:var(--muted);font-size:13px}
.section-body{position:relative;z-index:1;max-width:1100px;margin:0 auto;padding-top:calc(19vw + 15px)}
@media(min-width:1920px){.section-body{padding-top:380px}}
#about .section-body{padding-top:clamp(150px,15vw,220px)}
/* projects tem hero em fluxo normal, então não precisa do padding-top grande (senão vira espaço preto vazio) */
#projects .section-body{padding-top:0 !important}
/* admin nao precisa de banner de video no topo (deixava um espaco preto quando o video some) */
#cat-admin .section-band{display:none !important}
#cat-admin .section-body{padding-top:24px !important}
.eyebrow{font-size:12px;letter-spacing:4px;text-transform:uppercase;color:var(--red);font-weight:600;font-style:italic;text-align:center;margin-bottom:10px}
/* cross-links contextuais, sutis, dourados, com sublinhado pontilhado */
.xlink{color:var(--yellow);cursor:pointer;text-decoration:none;border-bottom:1px dotted rgba(242,194,48,.55);transition:.15s;font-weight:500}
.xlink:hover{color:#fff;border-bottom-color:var(--yellow);background:rgba(242,194,48,.12);border-radius:3px;padding:0 2px;margin:0 -2px}
/* botão read more / show less (só mobile) */
.mobtext-toggle{color:var(--yellow);cursor:pointer;font-weight:600;white-space:nowrap;margin-left:4px;text-decoration:none;border-bottom:1px solid rgba(242,194,48,.5)}
/* respiro entre ícone/emoji e o texto em badges, chips e botões (acabamento) */
.st-badge,.pc-brand,.sc-badge,.mb-lvlbadge,.up-free,.gc-price,.adv-crumb b,.pb-tag{letter-spacing:.2px}
.sc-bene span,.sc-earn b,.adv-tip b,.adv-def-h,.mob-drawer-item span{margin-left:1px}
.mobtext-toggle:hover{color:#fff}
/* modal do texto completo (quadrado central, rolável) */
#mobtext-ov{position:fixed;inset:0;z-index:10120;background:rgba(0,0,0,.72);backdrop-filter:blur(3px);display:none;align-items:center;justify-content:center;padding:18px}
#mobtext-ov.on{display:flex}
#mobtext-ov .mobtext-box{background:#101013;border:1px solid rgba(255,255,255,.14);border-radius:16px;width:100%;max-width:560px;max-height:72vh;display:flex;flex-direction:column;box-shadow:0 24px 60px -12px rgba(0,0,0,.8);overflow:hidden}
#mobtext-ov .mobtext-box-h{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid rgba(255,255,255,.1);flex:none}
#mobtext-ov .mobtext-box-h b{font-family:'Oswald',sans-serif;font-size:16px;color:var(--yellow);line-height:1.25}
#mobtext-ov .mobtext-x{background:rgba(255,255,255,.06);border:none;color:#c3c7cf;font-size:24px;line-height:1;width:36px;height:36px;border-radius:9px;cursor:pointer;flex:none;display:flex;align-items:center;justify-content:center}
#mobtext-ov .mobtext-x:hover{background:var(--red);color:#fff}
#mobtext-ov .mobtext-body{padding:18px;overflow-y:auto;-webkit-overflow-scrolling:touch;color:#dfe2e7;font-size:14.5px;line-height:1.65;font-family:'Oswald',sans-serif;font-weight:300}
#mobtext-ov .mobtext-body .xlink{color:var(--yellow)}
.eyebrow::before{content:"» ";color:var(--yellow)}.eyebrow::after{content:" «";color:var(--yellow)}
.sec-title{font-family:'Racing Sans One',cursive;font-size:clamp(30px,5.5vw,54px);text-transform:uppercase;text-align:center;color:#fff;line-height:1.05;margin-bottom:8px}
.sec-count{text-align:center;color:var(--yellow);font-weight:600;letter-spacing:1px;font-style:italic;margin-bottom:36px}
.sec-sub{text-align:center;color:var(--muted);max-width:720px;margin:0 auto 30px;font-size:16px}

/* lista de marcas estilo garagem (não card) */
/* ===== CARROSSEL DE MARCAS ESTILO MOST WANTED ===== */
.mw-list{
  display:flex;gap:16px;overflow-x:auto;overflow-y:hidden;
  padding:10px 4px 24px;scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;scrollbar-width:thin;
  scrollbar-color:var(--red) transparent;
}
.mw-list::-webkit-scrollbar{height:6px}
.mw-list::-webkit-scrollbar-track{background:rgba(255,255,255,.05);border-radius:3px}
.mw-list::-webkit-scrollbar-thumb{background:var(--red);border-radius:3px}
.mw-list::-webkit-scrollbar-thumb:hover{background:#b01818}

.mw-card{
  position:relative;flex:0 0 auto;width:170px;height:190px;
  background:rgba(20,20,20,.7);scroll-snap-align:start;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:10px;padding:20px 14px;cursor:pointer;transition:.22s;
  border:1px solid rgba(255,255,255,.06);
}
/* brackets nos cantos (moldura estilo jogo) */
.mw-card::before,.mw-card::after{
  content:"";position:absolute;width:20px;height:20px;transition:.22s;pointer-events:none;
}
.mw-card::before{top:8px;left:8px;border-top:2px solid var(--ac);border-left:2px solid var(--ac)}
.mw-card::after{bottom:8px;right:8px;border-bottom:2px solid var(--ac);border-right:2px solid var(--ac)}
.mw-card:hover{background:rgba(30,30,30,.92);transform:translateY(-6px)}
.mw-card:hover::before{top:4px;left:4px;width:26px;height:26px}
.mw-card:hover::after{bottom:4px;right:4px;width:26px;height:26px}
.mw-card:hover .mw-ico{transform:scale(1.08);filter:drop-shadow(0 0 12px var(--ac))}

.mw-ico{
  width:80px;height:64px;display:flex;align-items:center;justify-content:center;
  transition:.22s;
}
/* painel claro atrás dos logos (imagens) para legibilidade de logos escuros/transparentes */
.mw-ico:has(img){background:#f3f3f3;border-radius:8px;padding:8px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.mw-ico svg{width:100%;height:100%;stroke:#fff;fill:none;stroke-width:1.4}
.mw-card:hover .mw-ico svg{stroke:var(--ac)}
.mw-cname{font-weight:600;font-size:16px;color:#fff;font-style:italic;text-transform:uppercase;
  letter-spacing:.5px;text-align:center;line-height:1.1}
.mw-cdesc{font-size:11px;color:var(--muted);text-align:center;line-height:1.2}
.mw-crumb{ /* dica de rolar */
  text-align:center;color:var(--muted);font-size:11px;letter-spacing:2px;
  text-transform:uppercase;margin-top:-6px;font-style:italic;
}
.mw-crumb::before{content:"« ";color:var(--yellow)}.mw-crumb::after{content:" »";color:var(--yellow)}

/* about */
.about-text{max-width:820px;margin:0 auto}
.about-text p{margin-bottom:18px;font-size:17px;color:#cfcfcf;line-height:1.7}
.about-text strong{color:#fff;font-weight:600}
.about-split{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:30px}
/* social proof (Google + Instagram) */
.sp-wrap{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:1000px;margin:36px auto 0}
.sp-block{background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.01));border:1px solid var(--line);border-radius:16px;padding:22px;text-align:center}
.sp-g-head,.sp-ig-head{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:14px}
.sp-g-head b,.sp-ig-head b{font-family:'Oswald',sans-serif;font-size:15px;color:#fff}
.sp-rating{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:6px}
.sp-num{font-family:'Racing Sans One',cursive;font-size:34px;color:#fff}
.sp-star{color:#3a3a3a;font-size:22px}.sp-star.full{color:#FFC107}.sp-star.half{background:linear-gradient(90deg,#FFC107 50%,#3a3a3a 50%);-webkit-background-clip:text;background-clip:text;color:transparent}
.sp-count{color:#9aa0aa;font-size:13px;margin-bottom:14px}
.sp-btn{display:inline-block;margin-top:14px;background:#fff;color:#111;border-radius:10px;padding:11px 22px;font-family:'Oswald',sans-serif;font-weight:600;font-size:13px;text-decoration:none;transition:.15s}
.sp-btn:hover{transform:translateY(-2px);box-shadow:0 10px 26px -12px rgba(255,255,255,.5)}
.sp-ig-btn{background:linear-gradient(135deg,#833AB4,#E1306C,#F77737);color:#fff}
.sp-ig-grid{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:6px;margin-bottom:10px}
.sp-ig-cell{aspect-ratio:1;background:rgba(255,255,255,.04);border-radius:8px;display:flex;align-items:center;justify-content:center;transition:.15s}
.sp-ig-cell:hover{background:rgba(225,48,108,.15)}
.sp-ig-note{color:#7a7f88;font-size:11px;line-height:1.5}
.sp-embed{width:100%;height:340px;border:none;border-radius:10px;background:#0c0d10}
.sp-embed-box{width:100%;min-height:340px;border-radius:10px;background:#0c0d10;overflow:hidden}
.sp-embed-box iframe,.sp-embed-box behold-widget{width:100%!important;border:none;border-radius:10px}
@media(max-width:720px){.sp-wrap{grid-template-columns:1fr;gap:12px;margin:24px auto 0}.sp-block{padding:16px}.sp-embed,.sp-embed-box{height:auto;min-height:240px}.sp-ig-grid{grid-template-columns:1fr 1fr;gap:5px}}
#about,#catalog{min-height:auto;padding-bottom:50px}
#about{padding-bottom:10px}
#catalog{padding-top:10px}
#catalog .section-body{padding-top:0 !important}
#cat-blacklist .section-body{padding-top:34px !important}
.about-split{margin-bottom:0}
.about-split img{width:100%;height:clamp(150px,22vw,260px);object-fit:cover;border:1px solid var(--line);border-radius:6px}
@media(max-width:600px){.about-split{grid-template-columns:1fr}.mw-card{width:150px;height:175px}}

/* container dos botões voltar/menu, nunca sobrepõem, se ajustam ao texto de qualquer idioma */
.navbtns{position:fixed;top:20px;left:20px;z-index:9000;display:flex;gap:8px;align-items:stretch}
.back-btn,.prev-btn{position:static;display:none;align-items:center;gap:8px;
  padding:10px 18px;background:rgba(8,8,10,.92);border:1px solid var(--line);backdrop-filter:blur(8px);
  cursor:pointer;font-family:'Oswald';font-weight:600;text-transform:uppercase;letter-spacing:1px;
  font-size:13px;color:#fff;font-style:italic;transition:.2s;border-radius:6px;box-shadow:0 6px 18px -6px rgba(0,0,0,.8);white-space:nowrap}
.back-btn:hover,.prev-btn:hover{border-color:var(--red);color:var(--yellow)}
.back-btn::before{content:"«";color:var(--yellow);font-weight:700}
.prev-btn::before{content:"‹";color:var(--yellow);font-weight:700;font-size:16px;line-height:1}
body.in-section .back-btn,body.brand-open .back-btn,body.solo-open .back-btn,body.acct-open .back-btn,body.admin-open .back-btn{display:flex}
body.brand-open .prev-btn,body.in-section .prev-btn,body.has-prev .prev-btn{display:flex}
/* garante que o Main Menu também apareça quando o Back aparece (ex: catálogo aberto pelo Expert Guide) */
body.has-prev .back-btn{display:flex}
@media(max-width:640px){.back-btn,.prev-btn{padding:9px 12px;font-size:11px;letter-spacing:.5px}.navbtns{gap:6px;left:10px;top:12px}}
/* ===================== CARRINHO ===================== */
.hdr-actions{position:fixed;top:20px;right:20px;z-index:10002;display:flex;flex-direction:row-reverse;align-items:center;gap:14px}
  .cart-icon-wrap{position:relative}
.cart-icon-btn{display:flex;align-items:center;gap:9px;padding:10px 16px;background:rgba(0,0,0,.75);border:1px solid var(--line);
  backdrop-filter:blur(8px);border-radius:4px;cursor:pointer;color:#fff;font-family:'Oswald';font-weight:600;
  text-transform:uppercase;letter-spacing:1px;font-size:13px;font-style:italic;transition:.2s;position:relative}
.cart-icon-btn:hover{border-color:var(--red);color:var(--yellow)}
.cart-icon-btn svg{width:22px;height:22px}
.cart-icon-label{margin-left:2px}
.cart-badge{position:absolute;top:-8px;left:20px;min-width:20px;height:20px;padding:0 5px;background:var(--red);color:#fff;
  border-radius:12px;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;font-style:normal;letter-spacing:0}
.cart-badge.pop{animation:cartpop .35s ease}
.notif-wrap{position:relative}
.notif-btn{position:relative;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.14);border-radius:12px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;transition:.15s}
.notif-btn:hover{border-color:var(--yellow);color:var(--yellow)}
.notif-btn svg{width:20px;height:20px}
.notif-badge{position:absolute;top:-6px;right:-6px;min-width:19px;height:19px;padding:0 5px;background:var(--red);color:#fff;border-radius:999px;font-family:'Oswald',sans-serif;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px -1px rgba(210,31,31,.7)}
.notif-panel{position:absolute;top:52px;right:0;width:340px;max-width:88vw;max-height:70vh;overflow-y:auto;background:#0d0e10;border:1px solid rgba(255,255,255,.14);border-radius:14px;box-shadow:0 30px 80px -20px rgba(0,0,0,.9);padding:8px;display:none;z-index:10060}
.notif-panel.on{display:block}
.notif-panel .np-head{display:flex;justify-content:space-between;align-items:center;padding:8px 10px;border-bottom:1px solid rgba(255,255,255,.08);margin-bottom:6px}
.notif-panel .np-head b{font-family:'Racing Sans One',sans-serif;color:var(--yellow);font-size:14px}
.notif-panel .np-head a{color:#9aa0aa;font-size:11px;cursor:pointer;font-family:'Oswald',sans-serif}
.notif-item{display:flex;gap:10px;padding:10px;border-radius:10px;transition:.12s}
.notif-item:hover{background:rgba(255,255,255,.03)}
.notif-item.unread{background:rgba(242,194,48,.06)}
.notif-item .ni-ic{flex:none;width:34px;height:34px;border-radius:9px;background:rgba(46,199,122,.15);display:flex;align-items:center;justify-content:center;font-size:16px}
.notif-item .ni-tx{flex:1}
.notif-item .ni-tx b{color:#fff;font-family:'Oswald',sans-serif;font-size:13.5px;display:block}
.notif-item .ni-tx span{color:#9aa0aa;font-size:12px}
.notif-item .ni-tx .ni-time{color:#7a7f88;font-size:10.5px;margin-top:2px}
.notif-item a.ni-link{color:var(--yellow);font-size:11.5px;font-family:'Oswald',sans-serif}
.notif-empty{color:#7a7f88;text-align:center;padding:24px 10px;font-size:13px;font-family:'Oswald',sans-serif}
@keyframes cartpop{0%{transform:scale(0)}60%{transform:scale(1.35)}100%{transform:scale(1)}}
.cart-mini{position:absolute;top:52px;right:0;z-index:10060;width:380px;max-width:92vw;background:#0e0e0e;border:1px solid var(--yellow);
  border-radius:10px;box-shadow:0 24px 60px -16px rgba(0,0,0,.85);opacity:0;visibility:hidden;transform:translateY(-8px);transition:.2s;overflow:hidden}
.cart-mini.open{opacity:1;visibility:visible;transform:translateY(0)}
.cart-mini-body{max-height:340px;overflow-y:auto;padding:6px}
.cart-empty{padding:26px;text-align:center;color:var(--muted);font-size:14px}
.cart-mini-row{display:grid;grid-template-columns:56px 1fr auto;gap:10px;padding:12px;border-bottom:1px solid var(--line);align-items:start}
.cart-mini-thumb{width:56px;height:56px;border-radius:6px;overflow:hidden;background:#1a1a1a;border:1px solid var(--line)}
.cart-mini-thumb img{width:100%;height:100%;object-fit:cover}
.cart-mini-thumb .noimg{width:100%;height:100%;background:#161616}
.cart-mini-brand{font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--yellow)}
.cart-mini-name{font-size:13px;color:#eee;line-height:1.3;margin:2px 0}
.cart-mini-price{font-size:12px;color:var(--muted)}
.cart-mini-qty{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.cart-mini-qty button{width:24px;height:24px;border:1px solid var(--line);background:#1a1a1a;color:#fff;border-radius:4px;cursor:pointer;font-size:14px;line-height:1}
.cart-mini-qty button:hover{border-color:var(--yellow);color:var(--yellow)}
.cart-mini-qty span{min-width:20px;text-align:center;font-size:13px;color:#fff}
.cart-mini-rm{width:auto!important;padding:0 8px;font-size:10px!important;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)!important}
.cart-mini-rm:hover{color:var(--red)!important;border-color:var(--red)!important}
.cart-mini-foot{padding:16px;border-top:1px solid var(--yellow);background:rgba(242,194,48,.04)}
.cart-mini-totalrow{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;font-size:15px;color:#fff;font-weight:600}
.cart-mini-totalrow span:last-child{color:var(--yellow)}
.cart-mini-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.cart-btn-view,.cart-btn-checkout{padding:12px;border:none;border-radius:6px;cursor:pointer;font-family:'Racing Sans One',cursive;
  font-size:14px;letter-spacing:.5px;text-transform:uppercase;transition:.2s}
.cart-btn-view{background:#1c1c1c;color:#fff;border:1px solid var(--line)}
.cart-btn-view:hover{border-color:var(--yellow);color:var(--yellow)}
.cart-btn-checkout{background:var(--red);color:#fff}
.cart-btn-checkout:hover{background:#e5352f;transform:translateY(-2px)}
.cart-btn-checkout.big{width:100%;padding:15px;font-size:16px;margin-top:6px}
.cart-btn-view.ghost{width:100%;background:transparent;margin-top:10px}
/* botão add-to-cart na tabela */
.add-cart-btn{display:inline-flex;align-items:center;gap:4px;padding:6px 12px;background:var(--yellow);color:#1a1a1a;
  border:none;border-radius:6px;cursor:pointer;font-family:'Oswald';font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.5px;transition:.2s;white-space:nowrap}
.add-cart-btn:hover{background:#ffd84a;transform:translateY(-1px);box-shadow:0 6px 16px -6px rgba(242,194,48,.6)}
.prod-table th.th-cart,.prod-table td.pcart{text-align:center;white-space:nowrap}
/* página de carrinho cheia */
.cart-full-wrap{display:grid;grid-template-columns:1.6fr .9fr;gap:24px;max-width:1100px;margin:10px auto 0;align-items:start}
@media(max-width:860px){.cart-full-wrap{grid-template-columns:1fr}}
.cart-full-left{background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.cart-full-head{display:grid;grid-template-columns:1fr auto auto;gap:20px;padding:16px 20px;border-bottom:1px solid var(--line);
  font-size:12px;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}
.cart-full-row{display:grid;grid-template-columns:70px 1fr auto auto 28px;gap:16px;align-items:center;padding:16px 20px;border-bottom:1px solid var(--line)}
.cart-full-thumb{width:70px;height:70px;border-radius:6px;overflow:hidden;background:#1a1a1a;border:1px solid var(--line)}
.cart-full-thumb img{width:100%;height:100%;object-fit:cover}
.cart-full-thumb .noimg{width:100%;height:100%}
.cart-full-name{font-size:14px;color:#eee;line-height:1.35;margin:3px 0}
.cart-full-qty{display:flex;align-items:center;gap:8px}
.cart-full-qty button{width:28px;height:28px;border:1px solid var(--line);background:#1a1a1a;color:#fff;border-radius:5px;cursor:pointer;font-size:15px}
.cart-full-qty button:hover{border-color:var(--yellow);color:var(--yellow)}
.cart-full-qty span{min-width:24px;text-align:center;color:#fff}
.cart-full-line{color:var(--yellow);font-weight:600;white-space:nowrap}
.cart-full-rm{width:28px;height:28px;border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:5px;cursor:pointer;font-size:16px}
.cart-full-rm:hover{border-color:var(--red);color:var(--red)}
.cart-full-right{position:sticky;top:80px}
.cart-sum-box{background:linear-gradient(180deg,rgba(242,194,48,.05),rgba(0,0,0,.2));border:1px solid var(--yellow);border-radius:10px;padding:24px}
.cart-sum-total{display:flex;justify-content:space-between;align-items:center;font-size:18px;color:#fff;padding-bottom:16px;border-bottom:1px solid var(--line)}
.cart-sum-total strong{color:var(--yellow);font-size:22px}
.cart-sum-line{display:flex;justify-content:space-between;align-items:center;font-size:14px;color:#ccc;margin-bottom:10px}
.cart-ship-rules{margin:16px 0 18px;display:flex;flex-direction:column;gap:8px}
.ship-rule{font-size:12px;color:#ccc;display:flex;align-items:center;gap:8px;line-height:1.4}
.sr-tag{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:2px 8px;border-radius:10px;white-space:nowrap}
.sr-tag.turbos{background:rgba(37,211,102,.14);color:#25D366}
.sr-tag.perf{background:rgba(66,133,244,.16);color:#6ea8ff}
.sr-tag.bk{background:rgba(242,194,48,.16);color:var(--yellow)}
  .sr-tag.wheels{background:rgba(138,110,242,.18);color:#a690ff}
/* confirmação do pedido */
.order-confirm{margin-top:26px;padding:30px;text-align:center;background:linear-gradient(180deg,rgba(37,211,102,.06),rgba(0,0,0,.15));border:1px solid #25D366;border-radius:12px}
.oc-check{width:56px;height:56px;margin:0 auto 14px;border-radius:50%;background:#25D366;color:#fff;font-size:30px;display:flex;align-items:center;justify-content:center}
.order-confirm h3{font-family:'Racing Sans One',cursive;font-size:22px;color:#fff;text-transform:uppercase;letter-spacing:1px;margin:0 0 12px}
.oc-msg{max-width:620px;margin:0 auto 20px;color:#ddd;line-height:1.6;font-size:15px}
.oc-btns{display:flex;gap:0;justify-content:center;max-width:620px;margin:0 auto 14px;border-radius:10px;overflow:hidden;box-shadow:0 12px 30px -12px rgba(0,0,0,.7)}
.oc-send-btn{flex:1 1 50%;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:16px 18px;color:#fff;
  font-family:'Racing Sans One',cursive;font-size:15px;letter-spacing:.5px;text-transform:uppercase;transition:.2s;cursor:pointer}
.oc-send-btn svg{width:22px;height:22px;flex:none}
.oc-wa-btn{background:#25D366}
.oc-wa-btn:hover{background:#1fbe5a}
.oc-bank{margin-top:22px;text-align:left;background:rgba(255,255,255,.03);border:1px solid rgba(242,194,48,.35);border-radius:12px;padding:18px 20px}
.oc-bank-h{font-family:'Racing Sans One',cursive;color:var(--yellow);font-size:16px;text-transform:uppercase;letter-spacing:1px;margin-bottom:12px}
.oc-bank-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 20px}
@media(max-width:600px){.oc-bank-grid{grid-template-columns:1fr}}
/* ==== ajustes só mobile (não afeta desktop), área tocável ==== */
@media(max-width:600px){
  .top-nav button, .top-nav a, [onclick*="goHome"], [onclick*="mainMenu"]{min-height:40px}
  #lang-toggle, .lang-toggle, .lang-btn, [id*="lang"] button, .langsel{min-height:40px !important;padding-top:8px !important;padding-bottom:8px !important}
  .cf-field input, .cf-field select, .cf-field textarea{min-height:46px;font-size:16px}
  .cart-btn-checkout, .cart-btn-view, .oc-send-btn, .dyno-btn{min-height:46px}
  .prod-card .add-btn, .prod-card button{min-height:42px}
}
.oc-bank-grid>div{display:flex;flex-direction:column;gap:2px}
.oc-bank-grid span{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:#8a8f98}
.oc-bank-grid b{font-size:15px;color:#fff;font-family:'Oswald',sans-serif;letter-spacing:.5px}
.oc-bank-note{margin:14px 0 0;font-size:12.5px;color:#c3c7cf;line-height:1.6;text-align:left}
.oc-mail-btn{background:#D21F1F;border-left:2px solid rgba(0,0,0,.35)}
.oc-mail-btn:hover{background:#b81a1a}
.oc-send-btn:hover{transform:translateY(-1px)}
.oc-again{display:inline-block;margin-bottom:4px;background:transparent;border:1px solid var(--line);color:var(--muted);
  padding:9px 18px;border-radius:8px;font-family:'Oswald';font-size:13px;letter-spacing:.5px;text-transform:uppercase;cursor:pointer;transition:.2s}
.oc-again:hover{border-color:#fff;color:#fff}
@media(max-width:480px){.oc-btns{flex-direction:column}.oc-mail-btn{border-left:none;border-top:2px solid rgba(0,0,0,.35)}}
.oc-signup{margin-top:24px;padding:22px;border-radius:12px;background:linear-gradient(180deg,rgba(242,194,48,.08),rgba(0,0,0,.2));border:1px solid rgba(242,194,48,.4);text-align:center}
.oc-signup-ico{font-size:26px;margin-bottom:6px}
.oc-signup h4{font-family:'Racing Sans One',cursive;color:var(--yellow);font-size:17px;text-transform:uppercase;letter-spacing:.5px;margin:0 0 8px}
.oc-signup p{color:#d2d2d2;font-size:13px;line-height:1.6;margin:0 auto 16px;max-width:520px}
.oc-signup-btn{background:var(--yellow);border:none;border-radius:10px;color:#111;font-family:'Racing Sans One',cursive;font-size:15px;letter-spacing:.5px;text-transform:uppercase;padding:13px 26px;cursor:pointer;transition:.18s}
.oc-signup-btn:hover{background:#e0b02c;transform:translateY(-1px)}
.oc-signup-note{margin-top:10px;font-size:12px;color:#2ec77a;min-height:15px}
.oc-signup.done{border-color:#2ec77a;background:linear-gradient(180deg,rgba(46,199,122,.08),rgba(0,0,0,.2))}
.oc-signup.done h4{color:#2ec77a}
.oc-num{font-size:13px;color:var(--muted)}
.oc-num strong{color:var(--yellow)}
.cart-sum-note{font-size:12px;color:var(--muted);margin:14px 0 18px}
/* checkout */
.checkout-panel{max-width:1100px;margin:34px auto 0;background:rgba(255,255,255,.02);border:1px solid var(--yellow);border-radius:10px;padding:28px}
/* ===== CHECKOUT/CARRINHO compacto no MOBILE (não altera desktop/tablet) ===== */
@media(max-width:640px){
  .cart-full-wrap{gap:14px;margin-top:6px}
  .cart-full-right{position:static !important;top:auto !important}
  .cart-full-head,.cart-full-row{padding:10px 12px;gap:8px}
  .cart-full-thumb{width:52px;height:52px}
  .cart-full-name{font-size:12.5px}
  .cart-sum-box{padding:14px}
  .cart-btn-checkout.big{padding:13px;font-size:15px}
  .checkout-panel{padding:16px;margin-top:18px;border-radius:10px}
  .checkout-panel .cf-grid,.co-grid{grid-template-columns:1fr !important;gap:10px}
  .checkout-panel input,.checkout-panel select,.checkout-panel textarea,.cf-field input,.cf-field select{padding:10px 12px;font-size:14px}
  .cf-field label{font-size:12px}
  /* garante espaço no fim pra alcançar o botão Place order */
  #cat-cart{padding-bottom:120px !important}
  #cat-cart.active{min-height:auto}
  #checkout-panel{padding-bottom:24px}
  .checkout-panel h3{font-size:16px}
}
.checkout-title{font-family:'Racing Sans One',cursive;color:#fff;text-transform:uppercase;letter-spacing:1px;font-size:22px;margin:0 0 20px;text-align:center}
.checkout-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:700px){.checkout-grid{grid-template-columns:1fr}}
.cf-field{display:flex;flex-direction:column;gap:6px}
.cf-field.wide{grid-column:1 / -1}
.cf-field label{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--muted)}
.cf-field input,.cf-field textarea{background:#fff;border:none;border-radius:6px;padding:13px 15px;font-family:'Oswald';font-size:15px;color:#111}
.cf-field textarea{min-height:90px;resize:vertical}
/* mobile: fonte 16px evita o zoom automático do iOS ao focar o campo */
@media(max-width:600px){.cf-field input,.cf-field select,.cf-field textarea{font-size:16px !important;min-height:48px}}
.checkout-actions{margin-top:22px;text-align:center}
.checkout-note{font-size:12px;color:var(--muted);margin-top:12px}
/* ===== NEWS / BLOG ===== */
.news-grid{max-width:1100px;margin:10px auto 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}
.news-card{background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:10px;overflow:hidden;transition:.2s;cursor:pointer}
.news-card:hover{border-color:var(--yellow);transform:translateY(-3px)}
.news-card .news-thumb{width:100%;aspect-ratio:16/9;object-fit:cover;background:#141414}
.news-card .news-body{padding:18px}
.news-card .news-date{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--yellow)}
.news-card h3{font-size:18px;color:#fff;margin:8px 0}
.news-card p{font-size:14px;color:var(--muted);line-height:1.5}
.news-empty{grid-column:1 / -1;text-align:center;padding:50px 24px;background:linear-gradient(180deg,rgba(242,194,48,.04),rgba(0,0,0,.15));border:1px solid var(--line);border-radius:12px}
.news-empty-ico{width:64px;height:64px;margin:0 auto 18px}
.news-empty-ico svg{width:100%;height:100%}
.news-empty h3{font-family:'Racing Sans One',cursive;font-size:24px;color:#fff;text-transform:uppercase;letter-spacing:1px;margin:0 0 12px}
.news-empty p{max-width:560px;margin:0 auto 10px;color:#ccc;line-height:1.6}

/* contato */
.contact-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;max-width:900px;margin:10px auto 0}
.contact-card{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:8px;
  padding:24px 16px;text-align:center;transition:.2s}
.contact-card:hover{border-color:var(--cc);background:rgba(255,255,255,.06);transform:translateY(-3px);box-shadow:0 10px 30px -8px var(--cc)}
.contact-card .ic{margin:0 auto 14px;width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--cc);transition:.25s;box-shadow:0 4px 16px -4px var(--cc)}
.contact-card .ic svg{width:28px;height:28px}
.contact-card:hover .ic{transform:scale(1.12) rotate(-4deg)}
.contact-card .lbl{font-weight:500;text-transform:uppercase;letter-spacing:1.5px;font-size:12px;color:#fff}
.contact-card .val{font-size:12px;color:var(--muted);margin-top:5px;word-break:break-word}
@media(max-width:600px){.contact-grid{grid-template-columns:repeat(2,1fr)}}
/* ===== PÁGINA DE CONTATO (colaboradores + formulário) ===== */
.contact-page-wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;max-width:1100px;margin:10px auto 0;align-items:start}
@media(max-width:900px){.contact-page-wrap{grid-template-columns:1fr}}
.collab-title{font-family:'Racing Sans One',cursive;font-size:15px;letter-spacing:2px;text-transform:uppercase;color:var(--yellow);text-align:center;margin:0 0 14px}
/* ===== PARCERIAS ===== */
.partners-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:900px;margin:22px auto 0}
.partner-card{display:flex;gap:14px;background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(0,0,0,.25));border:1px solid var(--line);border-radius:16px;padding:18px;align-items:flex-start}
.partner-card.partner-soon{opacity:.85}
.partner-flag{font-size:34px;line-height:1;flex:none}
.partner-city{font-family:'Racing Sans One',sans-serif;font-size:20px;color:#fff}
.partner-role{color:var(--yellow);font-family:'Oswald',sans-serif;font-size:13px;text-transform:uppercase;letter-spacing:.5px;margin:3px 0 8px}
.partner-note{color:#c3c7cf;font-size:13.5px;line-height:1.55}
.partner-badge{display:inline-block;margin-top:10px;background:rgba(46,199,122,.15);border:1px solid rgba(46,199,122,.4);color:#4ade80;font-size:12px;padding:4px 12px;border-radius:20px;font-family:'Oswald',sans-serif}
.partner-badge.soon{background:rgba(242,194,48,.12);border-color:rgba(242,194,48,.4);color:var(--yellow)}
.partner-invite{display:flex;gap:16px;align-items:flex-start;max-width:900px;margin:20px auto 0;background:linear-gradient(90deg,rgba(210,31,31,.14),rgba(242,194,48,.08));border:1px solid rgba(242,194,48,.35);border-radius:16px;padding:22px}
.partner-invite-ic{font-size:38px;line-height:1;flex:none}
.partner-invite b{display:block;font-family:'Oswald',sans-serif;font-size:18px;color:#fff;margin-bottom:6px}
.partner-invite p{color:#c3c7cf;font-size:14px;line-height:1.6;margin:0 0 14px}
.partner-invite-btn{background:var(--yellow);color:#111;border:none;border-radius:10px;padding:11px 22px;font-family:'Oswald',sans-serif;font-weight:600;font-size:14px;cursor:pointer;transition:.15s}
.partner-invite-btn:hover{filter:brightness(1.08);transform:translateY(-2px)}
@media(max-width:640px){.partners-grid{grid-template-columns:1fr;gap:12px}.partner-invite{flex-direction:column;gap:10px;padding:18px}.partner-city{font-size:18px}}
.collab-card{display:grid;grid-template-columns:150px 1fr;gap:18px;background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(0,0,0,.2));
  border:1px solid var(--yellow);border-radius:10px;padding:18px;box-shadow:0 18px 50px -22px rgba(242,194,48,.5)}
.collab-photo{width:150px;height:180px;border-radius:8px;overflow:hidden;border:1px solid var(--line);background:#0d0d0d}
.collab-photo img{width:100%;height:100%;object-fit:cover;display:block}
.collab-name{font-family:'Racing Sans One',cursive;font-size:20px;color:var(--yellow);margin:2px 0 12px;line-height:1.1}
.collab-role{font-size:12px;letter-spacing:1px;text-transform:uppercase;color:#fff;margin:-8px 0 12px;font-weight:600}
.collab-line{display:flex;align-items:center;gap:9px;margin:7px 0;font-size:14px;color:#e6e6e6}
.collab-line svg{width:17px;height:17px;stroke:var(--yellow);fill:none;stroke-width:1.8;flex:0 0 auto}
.collab-line a{color:#e6e6e6;transition:.2s}
.collab-line a:hover{color:var(--yellow)}
.collab-langs{margin-top:12px;font-size:13px;color:var(--muted);font-style:italic}
/* formulário */
.cform-box{background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(0,0,0,.25));border:1px solid var(--yellow);border-radius:10px;padding:26px 24px;box-shadow:0 18px 50px -22px rgba(242,194,48,.5)}
.cform-box h3{font-family:'Racing Sans One',cursive;font-size:20px;color:#fff;text-align:center;text-transform:uppercase;margin:0 0 18px;letter-spacing:1px}
.cform-box input,.cform-box textarea{width:100%;background:#fff;border:none;border-radius:6px;padding:14px 16px;margin-bottom:14px;
  font-family:'Oswald';font-size:15px;color:#111;box-sizing:border-box}
.cform-box textarea{min-height:120px;resize:vertical}
.cform-box input::placeholder,.cform-box textarea::placeholder{color:#8a8a8a}
.cform-send{width:100%;background:var(--yellow);color:#1a1a1a;border:none;border-radius:6px;padding:15px;
  font-family:'Racing Sans One',cursive;font-size:16px;letter-spacing:1px;text-transform:uppercase;cursor:pointer;transition:.2s}
.cform-send:hover{background:#ffd84a;transform:translateY(-2px);box-shadow:0 10px 26px -8px rgba(242,194,48,.6)}

.footer{text-align:center;padding:56px 20px 40px;border-top:1px solid var(--line);margin-top:70px;background:linear-gradient(180deg,transparent,rgba(0,0,0,.4))}
.footer img{height:56px;width:auto;max-width:100%;object-fit:contain;margin-bottom:20px;filter:drop-shadow(0 4px 16px rgba(210,31,31,.35))}
.footer p{color:var(--muted);font-size:13px;line-height:2}
.footer .fname{color:#fff;font-weight:600;font-style:italic;text-transform:uppercase;letter-spacing:1px}
/* ===== FOOTER GLOBAL (base dourada estilo Grupo HH) ===== */
.site-footer{margin-top:70px;padding:26px clamp(16px,4vw,50px) 40px;background:#050505}
.sf-box{max-width:1200px;margin:0 auto;border:1.5px solid var(--gold,#c9a53b);border-radius:6px;
  padding:clamp(24px,4vw,44px);display:grid;grid-template-columns:1.1fr 1.4fr 1fr;gap:clamp(24px,4vw,48px);
  background:linear-gradient(180deg,rgba(201,165,59,.04),rgba(0,0,0,.2))}
@media(max-width:900px){.sf-box{grid-template-columns:1fr;gap:30px}}
.sf-brand{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.sf-brand>img{width:auto;max-width:100%;height:auto;max-height:110px;object-fit:contain;filter:drop-shadow(0 6px 22px rgba(201,165,59,.35));margin:0}
.sf-box>*{min-width:0}
.sf-social-label{color:#e9d9a8;font-size:14px;letter-spacing:.5px;margin-top:2px}
.sf-social{display:flex;gap:12px}
.sf-social a{width:40px;height:40px;border:1.5px solid var(--gold,#c9a53b);border-radius:50%;display:flex;align-items:center;justify-content:center;transition:.2s}
.sf-social a:hover{background:var(--gold,#c9a53b)}
.sf-social a:hover svg{fill:#111}
.sf-social svg{width:19px;height:19px;fill:var(--gold,#c9a53b);transition:.2s}
.sf-links{display:grid;grid-template-columns:1fr 1fr;gap:6px 30px}
.sf-links a{display:block;color:#ececec;font-size:15px;letter-spacing:.5px;padding:9px 0;text-transform:uppercase;transition:.2s;cursor:pointer;text-align:left;background:none;border:none;font-family:inherit}
.sf-links a:hover{color:var(--gold,#c9a53b);transform:translateX(3px)}
.sf-hours{color:#ececec}
.sf-hours h4{color:#fff;font-size:16px;letter-spacing:.5px;margin:0 0 14px;text-transform:uppercase;font-weight:700}
.sf-hours .row{display:flex;align-items:center;gap:9px;font-size:14px;color:#dcdcdc;margin:7px 0}
.sf-hours .row svg{width:15px;height:15px;stroke:var(--gold,#c9a53b);fill:none;stroke-width:1.6;flex:0 0 auto}
.sf-bottom{grid-column:1 / -1;margin:8px auto 0;padding-top:26px;border-top:1px solid rgba(201,165,59,.3);width:100%;text-align:center;color:#8a8a8a;font-size:12px;line-height:1.9}
/* ===== BARRA DO INSTAGRAM (feed correndo) ===== */
.sf-ig{grid-column:1 / -1;width:100%;margin-top:10px;padding-top:22px;border-top:1px solid rgba(201,165,59,.3)}
.sf-ig-head{display:flex;align-items:center;justify-content:center;gap:9px;margin-bottom:14px;font-size:13px;color:#ddd;letter-spacing:.5px}
.sf-ig-head svg{width:20px;height:20px}
.sf-ig-head a{color:var(--yellow)}
.sf-ig-track{display:flex;gap:12px;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.sf-ig-track .ig-row{display:flex;gap:12px;animation:igscroll 40s linear infinite}
.sf-ig:hover .ig-row{animation-play-state:paused}
@keyframes igscroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.ig-post{flex:0 0 auto;width:120px;height:120px;border-radius:8px;overflow:hidden;border:1px solid var(--line);position:relative;background:#141414;display:block}
.ig-post img{width:100%;height:100%;object-fit:cover;transition:.3s}
.ig-post:hover img{transform:scale(1.08)}
.ig-post .ig-ov{position:absolute;inset:0;background:rgba(0,0,0,.35);opacity:0;display:flex;align-items:center;justify-content:center;transition:.2s}
.ig-post:hover .ig-ov{opacity:1}
.ig-post .ig-ov svg{width:24px;height:24px;fill:#fff}
.sf-bottom a{color:var(--gold,#c9a53b)}
.sf-bloglogo{height:44px;width:auto;margin:0 0 14px;filter:drop-shadow(0 3px 14px rgba(210,31,31,.4))}

/* transição de entrada das seções */
.section{opacity:0;transform:translateY(40px);transition:opacity .6s,transform .6s}
.section.reveal{opacity:1;transform:translateY(0)}

/* faixa preta com frase graffiti (substitui imagem no topo do Sobre) */
.tag-band{
  position:absolute;top:0;left:0;right:0;z-index:0;
  height:clamp(120px,18vw,200px);
  background:#050505;
  display:flex;align-items:center;justify-content:center;
  border-bottom:2px solid var(--red);
  overflow:hidden;
}
.tag-band::before{ /* textura sutil de grão */
  content:"";position:absolute;inset:0;opacity:.06;
  background:radial-gradient(circle at 20% 40%,#fff 0.5px,transparent 1px) 0 0/6px 6px;
}
.tag-band span{
  font-family:'Permanent Marker',cursive;
  font-size:clamp(28px,6vw,72px);
  color:#fff;text-transform:uppercase;letter-spacing:2px;
  transform:rotate(-2deg);
  text-shadow:0 0 20px rgba(255,255,255,.15), 3px 3px 0 rgba(210,31,31,.35);
  text-align:center;padding:0 20px;line-height:1;
}
.tag-img{
  max-width:min(1100px,92%);width:auto;height:auto;
  max-height:80%;object-fit:contain;
  filter:drop-shadow(0 0 24px rgba(255,255,255,.18));
  position:relative;z-index:1;
}
/* ===== FIND YOUR APPLICATION (veículos) ===== */
.veh-marquee{max-width:1240px;margin:30px auto 0;overflow-x:auto;overflow-y:hidden;padding:8px 0;cursor:grab;
  scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.veh-marquee::-webkit-scrollbar{display:none}
.veh-marquee.dragging{cursor:grabbing}
.veh-marquee.dragging a{pointer-events:none}
.veh-mq-track{display:flex;gap:16px;width:max-content}
/* subtítulo do Find Your Application menor (estava longo) */
#cat-vehicles .sec-count,#homeveh .sec-count,#cat-vehicle .sec-count{font-size:14px;max-width:760px;margin-left:auto;margin-right:auto;line-height:1.4}
#cat-vehicle .vehm-head .sec-count{font-size:13px}
.veh-marquee:hover .veh-mq-track{animation-play-state:paused}
@keyframes vehscroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
/* tile do marquee no estilo dos cards de marca (cantos, painel claro, nome, tagline) */
.veh-mq-tile{position:relative;flex:0 0 auto;width:168px;height:186px;background:rgba(20,20,20,.7);border:1px solid rgba(255,255,255,.06);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:18px 12px;cursor:pointer;transition:.22s;text-decoration:none}
.veh-mq-tile::before,.veh-mq-tile::after{content:"";position:absolute;width:20px;height:20px;transition:.22s;pointer-events:none}
.veh-mq-tile::before{top:8px;left:8px;border-top:2px solid var(--ac);border-left:2px solid var(--ac)}
.veh-mq-tile::after{bottom:8px;right:8px;border-bottom:2px solid var(--ac);border-right:2px solid var(--ac)}
.veh-mq-tile:hover{background:rgba(30,30,30,.92);transform:translateY(-6px)}
.veh-mq-tile:hover::before{top:4px;left:4px;width:26px;height:26px}
.veh-mq-tile:hover::after{bottom:4px;right:4px;width:26px;height:26px}
.veh-mq-tile:nth-child(4n+1){--ac:#D21F1F}.veh-mq-tile:nth-child(4n+2){--ac:#F2C230}.veh-mq-tile:nth-child(4n+3){--ac:#4aa3ff}.veh-mq-tile:nth-child(4n){--ac:#2ec77a}
.veh-mq-ico{width:96px;height:62px;display:flex;align-items:center;justify-content:center;background:#f3f3f3;border-radius:8px;padding:8px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);transition:.22s}
.veh-mq-tile:hover .veh-mq-ico{transform:scale(1.06);box-shadow:inset 0 0 0 1px rgba(0,0,0,.08),0 0 12px var(--ac)}
.veh-mq-ico img{max-width:100%;max-height:100%;object-fit:contain}
.veh-mq-name{font-family:'Oswald';font-weight:600;font-style:italic;font-size:15px;letter-spacing:.5px;text-transform:uppercase;color:#fff;text-align:center;line-height:1.1;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.veh-mq-tag{font-size:11px;color:var(--muted);text-align:center}
.veh-warn{font-size:26px;line-height:1}
.veh-warn.big{font-size:44px}
.veh-mq-crumb{text-align:center;color:var(--muted);font-size:11px;letter-spacing:2px;text-transform:uppercase;margin-top:12px;font-style:italic}
.veh-mq-crumb::before{content:"« "}.veh-mq-crumb::after{content:" »"}
/* card "Other" (marcas não convencionais) */
.veh-tile.other .veh-ico,.veh-mq-tile.other .veh-mq-ico{background:linear-gradient(135deg,#2a2a2a,#141414);color:var(--yellow)}
.veh-tile.other .veh-ico span,.veh-mq-tile.other .veh-mq-ico span{font-size:30px}
/* grid de marcas */
.veh-makes{max-width:1200px;margin:26px auto 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.veh-tile{display:flex;flex-direction:column;align-items:center;gap:10px;padding:18px 10px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:12px;cursor:pointer;transition:.18s;color:#e6e6e6}
.veh-tile:hover{border-color:var(--yellow);transform:translateY(-3px);box-shadow:0 14px 30px -16px rgba(242,194,48,.4)}
.veh-ico{width:96px;height:64px;display:flex;align-items:center;justify-content:center;background:#f3f3f3;border-radius:8px;overflow:hidden}
.veh-ico img{max-width:86%;max-height:86%;object-fit:contain}
.veh-name{font-family:'Oswald';font-weight:600;font-size:14px;letter-spacing:.5px;text-transform:uppercase;text-align:center}
.veh-cnt{font-size:11px;color:var(--muted)}
/* índice de modelos por marca */
.veh-idx-title{max-width:1200px;margin:52px auto 0;font-family:'Racing Sans One',cursive;color:#fff;text-transform:uppercase;letter-spacing:1px;font-size:20px;text-align:center}
.veh-modelindex{max-width:1200px;margin:20px auto 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}
.vmi-group{background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:10px;padding:14px 16px}
.vmi-head{display:flex;align-items:center;gap:8px;font-family:'Oswald';font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:#fff;font-size:14px;margin-bottom:10px;border-bottom:1px solid var(--line);padding-bottom:8px}
.vmi-head img{height:20px;width:auto;background:#f3f3f3;border-radius:3px;padding:2px}
.vmi-head span{margin-left:auto;font-size:11px;color:var(--yellow);letter-spacing:1px}
.vmi-chips{display:flex;flex-wrap:wrap;gap:6px;max-height:150px;overflow:auto}
.vmodel-chip{background:rgba(255,255,255,.04);border:1px solid var(--line);color:#cfcfcf;padding:5px 10px;border-radius:6px;font-family:'Oswald';font-size:12px;cursor:pointer;transition:.15s}
.vmodel-chip:hover{border-color:var(--yellow);color:#fff}
/* página da marca de veículo */
.vehm-banner{max-width:1100px;margin:0 auto;display:flex;align-items:center;gap:24px;padding:10px 0 4px}
.vehm-badge{width:150px;height:100px;flex:none;display:flex;align-items:center;justify-content:center;background:#f3f3f3;border-radius:12px;overflow:hidden;border:1px solid var(--line)}
.vehm-badge img{max-width:82%;max-height:82%;object-fit:contain}
.vehm-badge .veh-warn.big{color:#111}
/* head + hero quadrado da página da marca */
.vehm-head{text-align:center;margin-bottom:6px}
.vehm-hero{aspect-ratio:1/1;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#f3f3f3;overflow:hidden}
.vehm-hero img{width:100%;height:100%;object-fit:cover;display:block}
.vehm-hero img.is-logo{width:auto;height:auto;max-width:68%;max-height:68%;object-fit:contain}
.vehm-hero .veh-warn.big{color:#111;font-size:56px}
.vehm-hero-note{margin-top:10px;font-family:'Oswald';font-size:12px;letter-spacing:1px;text-transform:uppercase;color:#666}
/* layout história: imagem à esquerda (float) + texto à direita, transbordando pra baixo */
.vehm-story2{max-width:1100px;margin:26px auto 0;display:flex;gap:30px;align-items:flex-start}
.vehm-hero-f{flex:0 0 min(44%,430px);align-self:flex-start;border-radius:14px;overflow:hidden;border:1px solid var(--line);box-shadow:0 24px 60px -30px rgba(0,0,0,.9);background:#111}
.vehm-hero-f img{width:100%;height:auto;display:block}
.vehm-hero-f .veh-warn.big{color:#111}
.vehm-hero-f.ph{aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;background:#f3f3f3}
.vehm-text-f{flex:1;min-width:0;overflow:hidden;font-size:var(--vfit,16px)}
.vehm-text-f .vt-tag{color:var(--yellow);font-family:'Oswald';font-weight:600;font-style:italic;text-transform:uppercase;letter-spacing:1.5px;font-size:1.3em;margin:0 0 .8em;line-height:1.25}
.vehm-text-f p{color:#cfcfcf;line-height:1.7;margin:0 0 .85em;font-size:1em}
.vehm-text-f p:last-child{margin-bottom:0}
.vehm-text-f p strong{color:#fff}
@media(max-width:640px){.vehm-story2{flex-direction:column}.vehm-hero-f{flex:none;width:100%;max-width:360px;margin:0 auto}.vehm-text-f{height:auto!important;font-size:15px!important}}
/* cards de modelos */
.vehm-models{max-width:1100px;margin:30px auto 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px}
/* barra de busca de modelo */
.vehm-modelbar{max-width:1100px;margin:26px auto 0;display:flex;gap:14px;align-items:center;flex-wrap:wrap;justify-content:space-between}
.vehm-search{position:relative;flex:1;min-width:240px;max-width:480px}
.vehm-search input{width:100%;background:#141416;border:1px solid rgba(255,255,255,.16);border-radius:11px;color:#fff;font-family:'Oswald',sans-serif;font-size:15px;padding:13px 40px 13px 42px}
.vehm-search input:focus{outline:none;border-color:var(--yellow);box-shadow:0 0 0 3px rgba(242,194,48,.14)}
.vehm-search-ic{position:absolute;left:14px;top:50%;transform:translateY(-50%);font-size:15px;opacity:.7}
.vehm-search-x{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:none;border:none;color:#9aa0aa;font-size:20px;cursor:pointer;line-height:1}
.vehm-modelcount{color:#9aa0aa;font-family:'Oswald',sans-serif;font-size:13px;white-space:nowrap}
/* modo carrossel (quando há muitos modelos): 2 linhas que rolam de lado */
.vehm-models.carousel{display:block;max-width:1160px;margin:20px auto 0}
.vehm-models.carousel .vmc-row{display:flex;gap:14px;overflow-x:auto;padding:6px 4px 14px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
.vehm-models.carousel .vmc-row::-webkit-scrollbar{height:8px}
.vehm-models.carousel .vmc-row::-webkit-scrollbar-thumb{background:rgba(242,194,48,.4);border-radius:8px}
.vehm-models.carousel .vmc-row::-webkit-scrollbar-track{background:rgba(255,255,255,.05);border-radius:8px}
.vehm-models.carousel .vmodel-card{flex:0 0 170px;scroll-snap-align:start}
.vehm-models.carousel .vmc-swipe{text-align:center;color:#7a7f88;font-family:'Oswald',sans-serif;font-size:11px;letter-spacing:1px;text-transform:uppercase;margin:2px 0 10px}
.vehm-models.carousel .vmc-empty{text-align:center;color:#8a8f98;padding:30px;font-family:'Oswald',sans-serif}
/* painéis por categoria (Find by Brand) */
#veh-cats{max-width:1200px;margin:26px auto 0;display:flex;flex-direction:column;gap:34px}
.veh-cat{border:1px solid color-mix(in srgb,var(--vc) 40%,#222);border-radius:16px;overflow:hidden;background:linear-gradient(180deg,color-mix(in srgb,var(--vc) 8%,#0b0b0d),#0b0b0d)}
.veh-cat .veh-cat-band{position:relative;height:120px;overflow:hidden;border-bottom:2px solid var(--vc)}
.veh-cat .veh-cat-band video{width:100%;height:100%;object-fit:cover;opacity:.55}
.veh-cat .veh-cat-tt{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-family:'Racing Sans One',sans-serif;font-size:32px;letter-spacing:1px;color:#fff;text-shadow:0 3px 14px #000;
  background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--vc) 22%,transparent))}
.veh-cat .veh-cat-tt b{color:var(--vc)}
.veh-cat .prod-filter{padding:16px 18px 6px}
.veh-cat .prod-filter h3,.veh-cat .prod-filter .fsub{display:none}
.veh-cat .prod-note{color:var(--vc);font-weight:700}
.veh-cat .add-cart-btn{border-color:var(--vc)}
.veh-cat .prod-table thead th{color:var(--vc)}
.veh-cat.empty{display:none}
.vmodel-card{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 12px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:12px;cursor:pointer;transition:.18s;color:#e6e6e6}
.vmodel-card:hover{border-color:var(--yellow);transform:translateY(-2px)}
.vmodel-card.active{border-color:var(--yellow);background:rgba(242,194,48,.1)}
.vmc-ph{font-size:34px;line-height:1;opacity:.7}
.vmc-photo{width:100%;aspect-ratio:5/3;object-fit:contain;background:#0d0d0f;border-radius:8px;margin-bottom:8px;display:block}
.vmc-logo{display:flex;align-items:center;justify-content:center;background:#f3f3f3;padding:14px}
.vmc-logo img{max-width:80%;max-height:64%;object-fit:contain}
.vmodel-card{padding-top:10px}
.vmc-name{font-family:'Oswald';font-weight:600;font-size:13px;letter-spacing:.5px;text-transform:uppercase;text-align:center}
.vmc-count{font-size:11px;color:var(--muted)}

/* bloco 1 */


/* ==== integração capa Most Wanted ==== */
#home{display:none !important}                 /* esconde o menu antigo do site */
body{padding-bottom:96px}                       /* espaço p/ o player fixo */

  #capa{--yellow:#F2C230;--red:#D21F1F}
  #capa *{margin:0;padding:0;box-sizing:border-box;user-select:none;-webkit-tap-highlight-color:transparent}
  #capa html, #capa body{width:100%;height:100%;overflow:hidden;background:#050506;font-family:'Oswald',sans-serif}

  /* ===================== PALCO ===================== */
  #capa{position:fixed;inset:0;z-index:9999;overflow:hidden;background:#050506}
  #capa .stage{position:fixed;inset:0;overflow:hidden}
  #capa .scene{position:absolute;inset:-4%;width:108%;height:108%;object-fit:cover;
    transition:transform .18s ease-out,opacity .6s ease;opacity:0}
  /* o escurecido/contraste agora e uma camada simples: mesmo visual, sem custo de filtro por quadro */
  #capa .stage::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
    background:linear-gradient(180deg,rgba(6,6,8,.18),rgba(6,6,8,.10) 45%,rgba(6,6,8,.26));mix-blend-mode:multiply}
  #capa .scene.ready{opacity:1}
  /* MOBILE + TABLET: o poster do vídeo (1º frame) aparece na hora, sem imagem estática genérica atrás */
  @media(max-width:1024px),(pointer:coarse){
    #capa .scene{opacity:1 !important}
    #capa .scene-fallback{display:none !important}
  }
  #capa .scene-fallback{position:absolute;inset:0;background:url('/assets/garage_bg.jpg?v=2') center 38%/cover,
    radial-gradient(ellipse at 60% 40%,#25211c 0%,#0c0b0a 70%);z-index:0}
  #capa .floor-fade{position:fixed;left:0;right:0;bottom:0;height:54%;z-index:3;pointer-events:none;
    background:linear-gradient(180deg,transparent 0%,rgba(5,5,6,.35) 38%,rgba(5,5,6,.86) 76%,#050506 100%)}
  #capa .top-fade{position:fixed;left:0;right:0;top:0;height:24%;z-index:3;pointer-events:none;
    background:linear-gradient(180deg,rgba(5,5,6,.7) 0%,transparent 100%)}
  #capa .vignette{position:fixed;inset:0;pointer-events:none;z-index:5;
    background:radial-gradient(ellipse at 50% 46%,transparent 34%,rgba(0,0,0,.72) 100%)}
  #capa .grain{position:fixed;inset:0;pointer-events:none;opacity:.05;z-index:6;
    background-image:repeating-linear-gradient(0deg,#000 0 1px,transparent 1px 3px)}

  /* ===================== LOGO ===================== */
  #capa .logo{position:fixed;top:26px;left:40px;z-index:12;width:clamp(158px,16vw,232px);height:auto;
    filter:drop-shadow(0 8px 22px rgba(0,0,0,.6))}
  #capa .logo-txt{position:fixed;top:26px;left:40px;z-index:12;font-family:'Permanent Marker',cursive;
    color:#fff;font-size:34px;text-shadow:3px 3px 0 var(--red),0 0 22px rgba(0,0,0,.8);transform:rotate(-3deg);display:none}

  #capa .skip{position:fixed;top:32px;right:40px;z-index:14;color:#c9c9c9;font-size:12px;letter-spacing:2px;
    text-transform:uppercase;cursor:pointer;border:1px solid rgba(255,255,255,.18);padding:8px 14px;border-radius:4px;
    background:rgba(10,10,12,.5);transition:.25s}
  #capa .skip:hover{color:#000;background:var(--yellow);border-color:var(--yellow)}

  /* ===================== "main menu" ===================== */
  #capa .mm-section{position:fixed;right:5vw;bottom:calc(17vh + 210px);z-index:12;font-family:'Permanent Marker',cursive;font-size:clamp(12px,1.15vw,15px);text-transform:lowercase;letter-spacing:2.5px;transform:skewX(-6deg) rotate(-1.5deg);text-shadow:2px 2px 0 rgba(0,0,0,.6),0 0 18px rgba(0,0,0,.6);transition:.25s;pointer-events:none;white-space:nowrap}
  @media(max-width:640px){#capa .mm-section{right:auto;left:12px;bottom:auto;top:60px;font-size:13px;letter-spacing:1.5px}}
  #capa .mm-title{position:fixed;right:5vw;bottom:calc(17vh + 96px);z-index:11;
    font-family:'Permanent Marker',cursive;font-size:clamp(26px,3vw,46px);color:#fff;text-transform:lowercase;
    transform:skewX(-6deg) rotate(-1.5deg);text-shadow:3px 3px 0 rgba(0,0,0,.65),0 0 26px rgba(0,0,0,.7),0 0 2px var(--red);
    transition:opacity .3s}

  /* ===================== CARROSSEL (menor) ===================== */
  #capa .menu-wrap{position:fixed;right:3vw;bottom:14vh;z-index:10;perspective:1000px;transition:transform .35s ease,opacity .35s ease}
  #capa .menu-track{display:flex;align-items:center;justify-content:flex-end;gap:14px;padding-right:44px;
    transform-style:preserve-3d;transition:transform .42s cubic-bezier(.22,1,.36,1);will-change:transform}
  #capa .mitem{position:relative;flex:0 0 auto;width:70px;height:70px;cursor:pointer;
    display:flex;align-items:center;justify-content:center;transform-style:preserve-3d;
    transition:transform .42s cubic-bezier(.22,1,.36,1),opacity .3s,filter .3s}
  #capa .mitem .ico{width:44px;height:44px;stroke:rgba(255,255,255,.55);fill:none;stroke-width:5;transition:stroke .3s,filter .3s}
  #capa .mitem .lbl{position:absolute;top:112%;left:50%;transform:translateX(-50%);white-space:nowrap;
    font-family:'Oswald',sans-serif;font-weight:600;text-transform:uppercase;letter-spacing:.5px;font-size:14px;
    color:rgba(255,255,255,0);transition:color .3s;text-shadow:0 2px 4px rgba(0,0,0,.9)}
  #capa .mitem .bracket{position:absolute;inset:0;opacity:0;transition:.35s;pointer-events:none}
  #capa .mitem .bracket i{position:absolute;width:16px;height:16px;border:3px solid var(--yellow)}
  #capa .mitem .bracket i:nth-child(1){top:0;left:0;border-right:none;border-bottom:none}
  #capa .mitem .bracket i:nth-child(2){top:0;right:0;border-left:none;border-bottom:none}
  #capa .mitem .bracket i:nth-child(3){bottom:0;left:0;border-right:none;border-top:none}
  #capa .mitem .bracket i:nth-child(4){bottom:0;right:0;border-left:none;border-top:none}
  #capa .mitem .crown{position:absolute;top:-24px;left:50%;transform:translateX(-50%) scale(.6);opacity:0;transition:.35s;
    width:26px;height:26px;fill:var(--yellow);filter:drop-shadow(0 0 8px rgba(242,194,48,.6))}
  #capa .mitem.mm-off{opacity:0 !important;pointer-events:none;width:0 !important;margin:0 !important;overflow:hidden;transform:scale(.3) !important;transition:opacity .3s,width .3s}
#capa .mitem[data-d="1"]{transform:translateZ(-70px) rotateY(-22deg) scale(.82);opacity:.5}
  #capa .mitem[data-d="-1"]{transform:translateZ(-70px) rotateY(22deg) scale(.82);opacity:.5}
  #capa .mitem[data-d="2"]{transform:translateZ(-150px) rotateY(-30deg) scale(.62);opacity:.26}
  #capa .mitem[data-d="-2"]{transform:translateZ(-150px) rotateY(30deg) scale(.62);opacity:.26}
  #capa .mitem[data-d="3"], #capa .mitem[data-d="-3"]{transform:translateZ(-220px) scale(.5);opacity:.1}
  #capa .mitem[data-d="0"]{transform:translateZ(60px) scale(1.18)}
  #capa .mitem[data-d="0"] .ico{stroke:#fff;filter:drop-shadow(0 0 12px rgba(255,255,255,.55)) drop-shadow(0 0 4px var(--red))}
  #capa .mitem[data-d="0"] .lbl{color:#fff}
  #capa .mitem[data-d="0"] .bracket{opacity:1}
  #capa .mitem[data-d="0"].first .crown{opacity:1;transform:translateX(-50%) scale(1)}
  #capa .mitem:hover .ico{stroke:#fff}

  #capa .hint{position:fixed;right:3.5vw;bottom:8vh;z-index:10;color:var(--yellow);font-size:11px;letter-spacing:3px;
    text-transform:uppercase;opacity:.7;animation:pulse 1.6s infinite;text-align:right;transition:opacity .3s}
  @keyframes pulse{0%,100%{opacity:.3}50%{opacity:.9}}

  /* ===================== PLAYER TRAX ===================== */
  #capa .trax{position:fixed;left:40px;bottom:7vh;z-index:12;width:380px;
    background:linear-gradient(90deg,rgba(15,15,17,.96),rgba(15,15,17,.62));border:1px solid rgba(255,255,255,.1);
    border-left:3px solid var(--yellow);padding:12px 16px;border-radius:8px;transition:transform .35s ease,opacity .3s ease}
  /* tablet: player compacto pra não cobrir os botões */
  @media(min-width:641px) and (max-width:1024px){
    #capa .trax{left:12px;bottom:12px;width:min(300px,42vw);padding:9px 12px;background:rgba(15,15,17,.97)}
    #capa .trax .bar,#capa .trax .time{display:none}
  }
  #capa .trax.hidden{transform:translateY(140%);opacity:0;pointer-events:none}
  #capa .trax-x{position:absolute;top:8px;right:10px;width:20px;height:20px;border-radius:4px;color:#aaa;cursor:pointer;
    display:flex;align-items:center;justify-content:center;font-size:15px;line-height:1}
  #capa .trax-x:hover{background:rgba(255,255,255,.12);color:#fff}
  #capa .trax-top{display:flex;align-items:center;gap:13px}
  #capa .disc{position:relative;width:44px;height:44px;border-radius:50%;border:2px solid var(--yellow);flex:none;
    display:flex;align-items:center;justify-content:center;background:#0d0d0f;cursor:pointer}
  #capa .disc::after{content:'';position:absolute;width:8px;height:8px;border-radius:50%;background:var(--yellow)}
  #capa .trax.playing .disc{animation:spin 4s linear infinite}
  @keyframes spin{to{transform:rotate(360deg)}}
  #capa .now{flex:1;min-width:0}
  #capa .now small{color:var(--yellow);font-size:9px;letter-spacing:2px;display:flex;align-items:center;gap:7px;margin-bottom:2px}
  #capa .now .t{font-weight:700;color:#fff;font-size:14px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #capa .now .s{color:#9a9a9a;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #capa .eq{display:inline-flex;align-items:flex-end;gap:2px;height:9px}
  #capa .eq b{width:3px;height:3px;background:var(--yellow);display:block;border-radius:1px}
  #capa .trax.playing .eq b{animation:bar .9s ease-in-out infinite}
  #capa .trax.playing .eq b:nth-child(2){animation-delay:.15s}#capa .trax.playing .eq b:nth-child(3){animation-delay:.3s}#capa .trax.playing .eq b:nth-child(4){animation-delay:.45s}
  @keyframes bar{0%,100%{height:3px}50%{height:9px}}
  #capa .bar{margin-top:10px;height:5px;background:rgba(255,255,255,.14);border-radius:3px;cursor:pointer;position:relative}
  #capa .bar .fill{position:absolute;left:0;top:0;bottom:0;width:0;background:var(--yellow);border-radius:3px}
  #capa .time{display:flex;justify-content:space-between;color:#8a8a8a;font-size:10px;margin-top:3px}
  #capa .ctrl-row{display:flex;align-items:center;margin-top:8px;gap:10px}
  #capa .ctrls{display:flex;align-items:center;justify-content:center;gap:10px}
  #capa .cbtn{width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.04);
    color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:13px;transition:.2s}
  #capa .cbtn:hover{background:var(--yellow);color:#000;border-color:var(--yellow)}
  #capa .cbtn svg{width:16px;height:16px;display:block}
  #capa .cbtn.big svg{width:19px;height:19px}
  #capa .cbtn.big{width:44px;height:44px;font-size:16px;border-color:var(--yellow);color:var(--yellow)}
  #capa .cbtn.big:hover{background:var(--yellow);color:#000}
  #capa .tracks-toggle{margin-left:auto;font-size:11px;letter-spacing:1px;color:var(--yellow);cursor:pointer;text-transform:uppercase;
    display:flex;align-items:center;gap:6px;border:1px solid rgba(242,194,48,.4);padding:5px 9px;border-radius:4px;transition:.2s}
  #capa .tracks-toggle:hover{background:var(--yellow);color:#000}

  /* chip pra reabrir a música */
  #capa .music-chip{position:fixed;left:40px;bottom:7vh;z-index:12;display:none;align-items:center;gap:9px;cursor:pointer;
    background:rgba(15,15,17,.95);border:1px solid rgba(242,194,48,.5);border-radius:30px;padding:9px 16px 9px 12px;color:#fff}
  #capa .music-chip.show{display:flex}
  #capa .music-chip:hover{background:var(--yellow);color:#000}
  #capa .music-chip .n{width:24px;height:24px;border-radius:50%;border:1px solid var(--yellow);display:flex;align-items:center;justify-content:center;color:var(--yellow);font-size:12px}
  #capa .music-chip:hover .n{color:#000;border-color:#000}
  #capa .music-chip b{font-size:12px;letter-spacing:1px;text-transform:uppercase}

  /* ===================== PÁGINA DE MÚSICAS ===================== */
  #capa .mpage{position:fixed;inset:0;z-index:30;display:none;align-items:center;justify-content:center;
    background:rgba(4,4,5,.86);backdrop-filter:blur(4px)}
  #capa .mpage.open{display:flex}
  #capa .mpanel{width:min(780px,93vw);height:min(84vh,760px);background:rgba(12,12,14,.98);border:1px solid rgba(255,255,255,.12);
    border-radius:14px;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 30px 90px rgba(0,0,0,.75)}
  #capa .mp-head{display:flex;align-items:center;gap:16px;padding:16px 20px;border-bottom:1px solid rgba(255,255,255,.1);flex:none}
  #capa .mp-head .ttl{font-family:'Racing Sans One';color:#fff;font-size:22px;letter-spacing:1px}
  #capa .mp-head .ttl span{color:var(--yellow)}
  #capa .mp-tabs{display:flex;gap:8px;margin-left:8px}
  #capa .mp-tab{font-size:12px;letter-spacing:1px;text-transform:uppercase;color:#bbb;cursor:pointer;
    padding:6px 12px;border-radius:20px;border:1px solid rgba(255,255,255,.16);transition:.2s}
  #capa .mp-tab.active{background:var(--yellow);color:#000;border-color:var(--yellow);font-weight:700}
  #capa .mp-close{margin-left:auto;width:34px;height:34px;border-radius:8px;border:1px solid rgba(255,255,255,.18);color:#ccc;
    cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:20px}
  #capa .mp-close:hover{background:rgba(255,255,255,.1);color:#fff}
  #capa .mp-list{flex:1;overflow-y:auto;padding:6px 0}
  #capa .mp-albums{display:flex;gap:8px;overflow-x:auto;padding:10px 4px 12px;scrollbar-width:none;flex:none}
  #capa .mp-albums::-webkit-scrollbar{display:none}
  #capa .mp-album{flex:none;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:10px;padding:8px 14px;cursor:pointer;transition:.15s;display:flex;flex-direction:column;align-items:flex-start;gap:1px;min-width:90px}
  #capa .mp-album:hover{border-color:var(--yellow)}
  #capa .mp-album.on{background:var(--yellow);border-color:var(--yellow)}
  #capa .mp-album .mp-album-g{font-family:'Oswald',sans-serif;font-weight:600;font-size:13px;color:#fff;white-space:nowrap}
  #capa .mp-album.on .mp-album-g{color:#111}
  #capa .mp-album .mp-album-n{font-size:9.5px;color:#9aa0aa;text-transform:uppercase;letter-spacing:.5px}
  #capa .mp-album.on .mp-album-n{color:rgba(0,0,0,.6)}
  #capa .mp-subs{display:flex;gap:8px;padding:0 4px 10px;flex:none}
  #capa .mp-sub{flex:1;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);border-radius:9px;padding:8px 12px;cursor:pointer;transition:.15s;font-family:'Oswald',sans-serif;font-weight:600;font-size:13px;color:#cfcfcf;display:flex;align-items:center;justify-content:center;gap:6px}
  #capa .mp-sub:hover{border-color:var(--yellow)}
  #capa .mp-sub.on{background:linear-gradient(180deg,rgba(242,194,48,.2),rgba(242,194,48,.05));border-color:var(--yellow);color:var(--yellow)}
  #capa .mp-sub span{font-size:10px;background:rgba(255,255,255,.12);padding:1px 6px;border-radius:8px;color:#fff}
  #capa .mp-sub.on span{background:var(--yellow);color:#111}
  #capa .mp-list::-webkit-scrollbar{width:9px}
  #capa .mp-list::-webkit-scrollbar-thumb{background:rgba(242,194,48,.4);border-radius:5px}
  #capa .mrow{display:flex;align-items:center;gap:14px;padding:11px 20px;cursor:pointer;transition:background .15s;border-left:3px solid transparent}
  #capa .mrow:hover{background:rgba(255,255,255,.05)}
  #capa .mrow.active{background:rgba(242,194,48,.1);border-left-color:var(--yellow)}
  #capa .mrow .num{width:24px;text-align:right;color:#777;font-size:13px;font-variant-numeric:tabular-nums;flex:none}
  #capa .mrow.active .num{color:var(--yellow)}
  #capa .mp-play{width:36px;height:36px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.05);
    color:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;flex:none;transition:.2s}
  #capa .mrow:hover .mp-play, #capa .mrow.active .mp-play{border-color:var(--yellow);color:var(--yellow)}
  /* play/pause fica INLINE na frente do nome (não flutuando no meio) */
  .mrow .mp-play,#capa .mrow .mp-play{position:static !important;transform:none !important;top:auto !important;left:auto !important;bottom:auto !important;right:auto !important;inset:auto !important;width:26px !important;height:26px !important;min-width:26px;font-size:10px !important;flex:none;border:1.5px solid rgba(255,255,255,.45);background:transparent;color:#fff;display:flex;align-items:center;justify-content:center;border-radius:50%;padding:0 0 0 2px;margin:0}
  .mrow.active .mp-play,#capa .mrow.active .mp-play{border-color:var(--yellow,#F2C230) !important;color:var(--yellow,#F2C230) !important;background:rgba(242,194,48,.12) !important}
  #capa .mrow.active .mp-play{border-color:var(--yellow,#F2C230);color:var(--yellow,#F2C230);background:rgba(242,194,48,.12)}
  #capa .meta{flex:1;min-width:0}
  #capa .meta .a{color:#fff;font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #capa .meta .b{color:#8f8f8f;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #capa .star{width:34px;height:34px;flex:none;display:flex;align-items:center;justify-content:center;cursor:pointer;
    color:#666;font-size:20px;transition:.2s;border-radius:8px}
  #capa .star:hover{background:rgba(255,255,255,.08)}
  #capa .star.on{color:var(--yellow);text-shadow:0 0 10px rgba(242,194,48,.6)}
  #capa .mp-empty{padding:60px 30px;text-align:center;color:#888;font-size:15px;line-height:1.6}
  #capa .mp-empty b{color:var(--yellow)}
  #capa .mp-foot{flex:none;padding:12px 20px;border-top:1px solid rgba(255,255,255,.1);display:flex;align-items:center;gap:12px;color:#9a9a9a;font-size:12px}
  #capa .mp-foot .dot{color:var(--yellow)}

  #capa .flash{position:fixed;inset:0;z-index:9998;background:#fff;opacity:0;pointer-events:none;transition:opacity .08s}

  @media(max-width:860px){
    #capa .menu-wrap{left:0;right:0;bottom:13vh}
    #capa .menu-track{justify-content:center;gap:10px;padding-right:0}
    #capa .mitem{width:60px;height:60px}#capa .mitem .ico{width:38px;height:38px}
    #capa .hint{display:none}
    #capa .mm-title{right:auto;left:50%;transform:translateX(-50%) skewX(-6deg);bottom:calc(13vh + 84px)}
    #capa .trax{left:8px;bottom:8px;transform:none;width:min(46vw,175px);padding:7px 9px !important;z-index:9;border-radius:12px}
    /* (regras do player mobile movidas pra @media(max-width:640px), só celular, não tablet) */
    #capa .trax.hidden{transform:translateY(160%)}
    #capa .trax .trax-title{font-size:11px}#capa .trax .disc{width:28px;height:28px}
    #capa .trax .trax-sub,#capa .trax .now,#capa .trax small{font-size:9px}
    #capa .trax .trax-bar,#capa .trax .trax-time,#capa .trax .bar,#capa .trax .time{display:none !important}
    #capa .trax .trax-ctrls button,#capa .trax .cbtn{width:30px !important;height:30px !important}
    #capa .trax .tracks-toggle{font-size:9px !important;padding:4px 8px !important}
    #capa .music-chip{left:8px;bottom:8px;transform:none;z-index:9}
    #capa .trax .trax-title{font-size:12px}#capa .trax .disc{width:34px;height:34px}
    #capa .logo{width:140px;top:16px;left:16px}
    #capa .mpanel{height:88vh}
  }

/* estado 'entrou no site' (mantém só o player/tracks) */
#capa.entered{pointer-events:none;background:transparent !important}
#capa.entered .stage,#capa.entered .vignette,#capa.entered .grain,
#capa.entered .logo,#capa.entered .logo-txt,#capa.entered .skip,
#capa.entered .mm-title,#capa.entered .menu-wrap,#capa.entered .hint,#capa.entered .mm-section{display:none !important}
#capa .mm-nav{position:fixed;right:3vw;bottom:4vh;left:auto;transform:none;z-index:12;display:flex;gap:10px;align-items:center}
#capa.entered .mm-nav{display:none !important}
#capa .mm-navbtn{min-width:54px;height:46px;border-radius:999px;border:1px solid rgba(242,194,48,.5);background:rgba(0,0,0,.5);color:#fff;font-size:22px;font-family:'Oswald',sans-serif;cursor:pointer;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);touch-action:manipulation;transition:.12s}
#capa .mm-navbtn:active{background:var(--yellow);color:#111;transform:scale(.96)}
#capa .mm-enter{font-size:13px;letter-spacing:2px;padding:0 20px;font-weight:600}
#capa.entered .trax,#capa.entered .music-chip,#capa.entered .mpage{pointer-events:auto}
/* login + carrinho aparecem tambem na capa (acima do overlay) */
.cart-icon-wrap,.acct-icon-wrap{z-index:10001 !important}

/* ==== PÁGINAS INDEPENDENTES (solo) ==== */
/* About e Catalog ficam ESCONDIDOS por padrão, só aparecem quando explicitamente ativos (nunca empilham na home) */
#about,#catalog{display:none !important}
body.solo-open #about.solo-active,body.solo-open #catalog.solo-active{display:block !important;opacity:1 !important;transform:none !important}
body.solo-open .section:not(.solo-active),
body.solo-open #home,
body.solo-open #homeveh{display:none !important}
body.solo-open .section.solo-active{display:block !important}

/* ==== FRASE: banner escuro no RODAPÉ da capa (separado, não atrapalha) ==== */
#capa .blp-tagband{position:absolute;left:0;right:0;bottom:0;z-index:11;pointer-events:none;
  display:flex;align-items:center;justify-content:center;padding:12px 0 14px;
  background:linear-gradient(180deg,rgba(5,5,6,0),rgba(5,5,6,.85) 45%,#050506 78%)}
#capa .blp-tagband img{height:min(7vh,58px);width:auto;max-width:82vw;opacity:.95;
  filter:drop-shadow(0 2px 10px rgba(0,0,0,.9))}
#capa.entered .blp-tagband{display:none !important}
/* sobe menu/player/hint pra ficarem acima do banner da frase */
#capa .menu-wrap{bottom:20vh}
#capa .hint{bottom:14vh}
#capa .trax{bottom:13vh}
#capa .mm-title{bottom:calc(23vh + 96px)}
@media(max-width:860px){#capa .blp-tagband img{max-width:92vw;height:min(6vh,44px)}}


/* bloco 2 */

#cat-dyno .dyno-warn{max-width:900px;margin:14px auto;background:rgba(210,31,31,.12);border:1px solid rgba(210,31,31,.4);color:#ff8a7a;border-radius:10px;padding:10px 16px;font-size:13px;text-align:center}
#cat-dyno .dyno-splits{max-width:1150px;margin:34px auto;display:flex;flex-direction:column;gap:26px}
#cat-dyno .dyno-split{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:center}
#cat-dyno .dyno-split.rev{direction:rtl}#cat-dyno .dyno-split.rev .dsx{direction:ltr}
#cat-dyno .dyno-split img{width:100%;border-radius:14px;border:1px solid #222;box-shadow:0 12px 30px rgba(0,0,0,.5)}
#cat-dyno .dyno-split .dsx h3{font-family:'Racing Sans One',sans-serif;color:#fff;font-size:24px;margin:0 0 8px}
#cat-dyno .dyno-split .dsx p{color:#b9bdc6;line-height:1.5}
#cat-dyno .dyno-tool{max-width:1200px;margin:20px auto 0;background:linear-gradient(180deg,#0d0e11,#0b0b0d);border:1px solid #22252c;border-radius:16px;padding:22px}
#cat-dyno .dyno-h{font-family:'Racing Sans One',sans-serif;color:#F2C230;font-size:18px;margin:18px 0 12px;border-left:3px solid #ff5a3c;padding-left:10px}
#cat-dyno .dyno-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
#cat-dyno .dyno-sel{display:flex;gap:14px;flex-wrap:wrap}
#cat-dyno .dyno-sel label,#cat-dyno .ds-hp{display:flex;flex-direction:column;gap:5px;font-size:12px;color:#8a8f98;flex:1;min-width:150px}
#cat-dyno select,#cat-dyno input[type=number]{background:#16181d;border:1px solid #2a2e36;border-radius:8px;padding:9px 11px;color:#fff;font-size:14px}
#cat-dyno .dyno-stock{display:flex;gap:16px;margin-top:16px;background:#111318;border:1px solid #23262d;border-radius:12px;padding:14px}
#cat-dyno .ds-photo{width:150px;flex:none}#cat-dyno .ds-photo img{width:100%;border-radius:8px;background:#f3f3f3}
#cat-dyno .ds-info{flex:1}#cat-dyno .ds-name{font-family:'Oswald';font-weight:600;color:#fff;font-size:18px;margin-bottom:8px}
#cat-dyno .ds-sub{font-size:11px;color:#777;margin-top:6px}
#cat-dyno .dyno-cats{display:flex;flex-direction:column;gap:9px}
#cat-dyno .dyno-cat{display:flex;align-items:center;gap:12px;background:#111318;border:1px solid #23262d;border-radius:10px;padding:11px 14px;cursor:pointer}
#cat-dyno .dyno-cat:hover{border-color:#ff5a3c}
#cat-dyno .dyno-cat.on{border-color:#F2C230;background:rgba(242,194,48,.08)}
#cat-dyno .dyno-cat .dc-ic{font-size:20px}
#cat-dyno .dyno-cat .dc-tt{flex:1}#cat-dyno .dyno-cat .dc-tt b{color:#fff;font-family:'Oswald';font-weight:600;display:block}
#cat-dyno .dyno-cat .dc-tt span{font-size:11px;color:#8a8f98}
#cat-dyno .dyno-cat .dc-hp{color:#4ade80;font-weight:700;font-size:13px}
#cat-dyno .dyno-canvas-wrap{background:#0a0b0d;border:1px solid #23262d;border-radius:12px;padding:10px}
#cat-dyno #dyno-canvas{width:100%;height:auto;display:block}
#cat-dyno .dyno-legend{display:flex;gap:18px;justify-content:center;font-size:12px;margin-top:6px}
#cat-dyno .lg-stock{color:#cfd3da}#cat-dyno .lg-est{color:#ff5a3c}
#cat-dyno .dyno-nums{display:flex;gap:12px;margin-top:14px;text-align:center}
#cat-dyno .dyno-nums>div{flex:1;background:#111318;border:1px solid #23262d;border-radius:10px;padding:12px 6px}
#cat-dyno .dyno-nums span{font-family:'Racing Sans One';font-size:26px;color:#fff;display:block}
#cat-dyno .dyno-nums .hi span{color:#ff5a3c}#cat-dyno .dyno-nums small{color:#8a8f98;font-size:10px;text-transform:uppercase;letter-spacing:.5px}
#cat-dyno .dyno-cap{font-size:11px;color:#777;text-align:center;margin-top:8px}
#cat-dyno .dyno-actions,#cat-dyno .dyno-cart-actions{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
#cat-dyno .dsl-prod{display:flex;align-items:center;gap:12px}
#cat-dyno .dsl-thumb{width:54px;height:54px;flex:none;border-radius:8px;overflow:hidden;background:#0d0e11;border:1px solid #262a32}
#cat-dyno .dsl-thumb img{width:100%;height:100%;object-fit:contain}
#cat-dyno .dsl-noimg{width:100%;height:100%;background:repeating-linear-gradient(45deg,#16181d,#16181d 6px,#1b1e24 6px,#1b1e24 12px)}
#cat-dyno .dsl-info{display:flex;flex-direction:column;gap:2px}
#cat-dyno .dsl-info b{color:#fff;font-size:13px;line-height:1.3}
#cat-dyno .dsl-info span{color:#8a8f98;font-size:11px}
#cat-dyno .dyno-kit-sum{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;background:rgba(242,194,48,.06);border:1px solid rgba(242,194,48,.25);border-radius:10px;padding:11px 15px;margin-top:12px;color:#cdd1d8;font-family:'Oswald';font-size:13px}
#cat-dyno .dyno-kit-sum .dkt-price b{color:var(--yellow);font-size:16px}
#cat-dyno .dyno-addmsg{margin-top:10px;font-family:'Oswald';font-size:13px;padding:0}
#cat-dyno .dyno-addmsg.ok{color:#4ade80;background:rgba(46,199,122,.08);border:1px solid rgba(46,199,122,.3);border-radius:8px;padding:10px 14px}
#cat-dyno .dyno-addmsg.warn{color:#e6a417;background:rgba(230,164,23,.08);border:1px solid rgba(230,164,23,.3);border-radius:8px;padding:10px 14px}
#cat-dyno .dyno-wheelcta{display:flex;align-items:center;gap:16px;margin-top:16px;background:linear-gradient(180deg,rgba(242,194,48,.07),rgba(255,255,255,.02));border:1px solid rgba(242,194,48,.3);border-radius:12px;padding:16px 18px;flex-wrap:wrap}
#cat-dyno .dyno-wheelcta .dwc-ico{width:46px;height:46px;flex:none}
#cat-dyno .dyno-wheelcta .dwc-ico svg{width:100%;height:100%}
#cat-dyno .dyno-wheelcta .dwc-tx{flex:1;min-width:220px;display:flex;flex-direction:column;gap:2px}
#cat-dyno .dyno-wheelcta .dwc-tx b{color:#fff;font-family:'Oswald',sans-serif;font-size:16px}
#cat-dyno .dyno-wheelcta .dwc-tx span{color:#b9bdc6;font-size:13px;line-height:1.5}
#cat-dyno .dyno-btn{background:#1b1e24;border:1px solid #2a2e36;color:#fff;border-radius:22px;padding:10px 20px;font-family:'Oswald';font-weight:600;cursor:pointer;font-size:13px}
#cat-dyno .dyno-btn:hover{border-color:#F2C230}
#cat-dyno .dyno-btn.start{background:#D21F1F;border-color:#D21F1F}
#cat-dyno .dyno-suggest{margin:10px 0;display:flex;flex-direction:column;gap:7px}
#cat-dyno .dyno-sug{background:rgba(66,133,244,.08);border:1px solid rgba(66,133,244,.3);border-radius:9px;padding:9px 13px;font-size:12px;color:#9fc0ff;display:flex;align-items:center;gap:10px}
#cat-dyno .dyno-sug button{margin-left:auto;background:#2a3550;border:none;color:#cfe0ff;border-radius:12px;padding:4px 12px;cursor:pointer;font-size:11px}
#cat-dyno .dyno-note,#cat-dyno .dyno-foot{font-size:11px;color:#777;margin-top:8px}
#cat-dyno .dyno-foot{border-top:1px solid #23262d;padding-top:12px;margin-top:20px}
#cat-dyno .dsl-x{background:none;border:none;color:#D21F1F;cursor:pointer;font-size:16px}
@media(max-width:860px){#cat-dyno .dyno-grid,#cat-dyno .dyno-split{grid-template-columns:1fr}#cat-dyno .dyno-split.rev{direction:ltr}}
@media(max-width:640px){
  #cat-dyno .dyno-tool{padding:14px;border-radius:12px}
  #cat-dyno .dyno-split{gap:14px}
  #cat-dyno .dyno-split .dsx h3{font-size:19px}
  #cat-dyno .dyno-split .dsx p{font-size:13px}
  #cat-dyno .dyno-h{font-size:15px;margin:14px 0 10px}
  #cat-dyno .dyno-cat{padding:9px 11px;gap:9px}
  #cat-dyno .dyno-cat .dc-ic{font-size:16px}
  #cat-dyno .dyno-cat .dc-tt b{font-size:13px}
  #cat-dyno .dyno-cat .dc-tt span{font-size:10px}
  #cat-dyno .dyno-stock{flex-direction:column;gap:10px;padding:12px}
  #cat-dyno .ds-photo{width:100%;max-width:180px;margin:0 auto}
  #cat-dyno .ds-name{font-size:15px}
  #cat-dyno .dyno-sel{gap:8px;flex-direction:column}
  #cat-dyno .dyno-sel label,#cat-dyno .ds-hp{min-width:0;flex:1 1 100%;width:100%}
  /* resultados (STOCK/POSSIBLE HP) e tool cabem no celular sem estourar pro lado */
  #cat-dyno .dyno-tool,#cat-dyno .dyno-grid,#cat-dyno .dyno-left,#cat-dyno .dyno-right,#cat-dyno .dyno-split{min-width:0;max-width:100%;overflow-x:hidden;box-sizing:border-box}
  #cat-dyno .dyno-nums{gap:8px;flex-wrap:wrap}
  #cat-dyno .dyno-nums>div{flex:1 1 calc(50% - 4px);min-width:0;padding:10px 4px;overflow:hidden}
  #cat-dyno .dyno-nums span{font-size:19px}
  #cat-dyno select,#cat-dyno input{max-width:100%;box-sizing:border-box}
  #cat-dyno select,#cat-dyno input[type=number]{font-size:13px;padding:8px 9px}
  #cat-dyno canvas{max-width:100% !important;height:auto !important}
}
/* =========================================================
   QA MOBILE, legibilidade e tap targets (como um cliente real)
   ========================================================= */
@media(max-width:640px){
  /* texto de meta dos produtos legível */
  .prod-card .pc-brand{font-size:11px !important}
  .prod-card .pc-code{font-size:10.5px !important}
  .prod-card .pc-stock{font-size:11px !important}
  .prod-card .pc-name{font-size:12.5px !important;line-height:1.35 !important}
  /* descrições dos cards de marca legíveis */
  .mw-cdesc{font-size:10.5px !important}
  .veh-mq-tag{font-size:10.5px !important}
  /* chips de modelo de carro: tocáveis (>=34px) */
  .vmodel-chip{min-height:34px !important;display:inline-flex !important;align-items:center;padding:7px 12px !important;font-size:12.5px !important}
  /* todos os botões/CTA com altura mínima tocável e texto legível */
  .prod-card .pc-add,.prod-card .pc-view,.pc-add,.pc-view{font-size:12.5px !important}
  .adm-btn,.set-btn,.bchip,.wsc-chip,.news-cat,.mb-pill{min-height:34px !important;display:inline-flex;align-items:center;justify-content:center}
  .cart-btn-view,.cart-btn-checkout,.age-btn,.exreq-cta,.gc-add,.adv-manual-btn,.adv-dyno-btn{min-height:44px !important;font-size:14px !important}
  /* filtros e selects tocáveis */
  select,.adm-sel,.filter-sel{min-height:40px !important;font-size:13px !important}
  /* parágrafos e listas: nunca abaixo de 13px */
  .section-body p,.section-body li,.prod-note,.hint{font-size:13px !important;line-height:1.55 !important}
  /* ESPAÇO entre botões (tela pequena precisa de folga pra tocar) */
  .pg-btn{min-width:38px !important;min-height:38px !important;margin:2px}
  .pagination,.pg-wrap,.pager{gap:6px !important}
  .prod-card .pc-btns{gap:8px !important}
  .adv-crumbs{gap:8px !important}
  .bchip{margin:2px}
  .brands,.adv-result .brands{gap:7px !important}
  /* botões em linha (row) com folga */
  .adm-row,.exreq-actions,.cart-mini-btns{gap:8px !important}
}
@media(max-width:1024px){
  html,body{overflow-x:hidden !important;overflow-x:clip !important;max-width:100vw}
  /* páginas: padding lateral consistente e nada estoura */
  .brand-page{padding-left:16px !important;padding-right:16px !important;overflow-x:hidden;overflow-x:clip}
  /* remove o borrão preto: reduz o espaço vazio do topo no mobile */
  .brand-page{padding-top:58px !important}
  .section-body{padding-top:16px !important}
  /* BANNER no fluxo (não absoluto), o vídeo aparece no topo e os textos vêm EMBAIXO com espaço, sem sobrepor */
  .section-band{position:static !important;height:170px !important;aspect-ratio:auto !important;width:100%;margin:0 0 6px;overflow:hidden}
  .section-band .band-video,.section-band img{height:170px !important;width:100% !important;object-fit:cover !important}
  .section-band::after{display:none}
  #about .section-body{padding-top:14px !important}
  .section-body{max-width:100% !important}
  /* eyebrow e títulos quebram, nunca cortam */
  .eyebrow{letter-spacing:2px !important;white-space:normal !important;word-break:break-word;padding:0 6px;line-height:1.4}
  .sec-title{word-break:break-word;line-height:1.05}
  .sec-count,.hint{word-break:break-word}
  /* CEO / collab card empilha e cabe */
  .collab-card{grid-template-columns:1fr !important;gap:14px !important;text-align:center}
  .collab-card>*{min-width:0}
  .collab-card img{max-width:150px;margin:0 auto;height:auto}
  .collab-info,.collab-contact{word-break:break-word}
  .collab-contact a,.collab-contact div{word-break:break-all;font-size:13px}
  /* ---- CARROSSÉIS viram GRID que quebra: SEM rolagem lateral ---- */
  .veh-marquee{overflow:visible !important;cursor:default}
  .veh-mq-track{flex-wrap:wrap !important;width:auto !important;justify-content:center;gap:10px !important;animation:none !important}
  .veh-mq-tile{flex:1 1 calc(50% - 10px) !important;width:auto !important;max-width:none;height:auto;min-height:150px}
  .veh-mq-crumb{display:none}
  /* exhaust brand cards */
  #cat-exhausts .fz-brands,#cat-exhausts .fz-brandrow{flex-wrap:wrap !important;overflow:visible !important;justify-content:center;gap:10px}
  #cat-exhausts .fz-brandcard{flex:1 1 calc(50% - 10px) !important;width:auto !important;max-width:none}
  /* brand carousel (mw-card) nas categorias */
  .mw-cardrow,.brand-carousel,.bc-track,.mw-list{flex-wrap:wrap !important;overflow:visible !important;width:auto !important;justify-content:center;gap:10px}
  .mw-card{flex:1 1 calc(50% - 10px) !important;width:auto !important;max-width:none;height:auto !important;min-height:150px;scroll-snap-align:none}
  /* news hero carousel empilha (sem swipe lateral) */
  .news-carousel{flex-direction:column !important;overflow:visible !important;gap:10px !important}
  .news-carousel .nc-slide{flex:1 1 auto !important;width:100% !important;aspect-ratio:16/9}
  .news-carousel .nc-dots{display:none !important}
  /* ---- PRODUCT TABLE vira cards ---- */
  table.prod-table{min-width:0 !important;width:100% !important;display:block}
  table.prod-table thead{display:none}
  table.prod-table tbody,table.prod-table tr,table.prod-table td{display:block;width:100% !important;box-sizing:border-box}
  table.prod-table tr{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:12px;margin-bottom:10px;padding:10px}
  table.prod-table td{border:none !important;padding:4px 0;text-align:left !important}
  .prod-table-wrap{overflow-x:visible !important}
  /* inputs/selects de busca 100% e texto visível */
  input[type=text],input[type=search],input[type=email],input[type=number],select,textarea{max-width:100%;box-sizing:border-box}
  .wsc-search,#co-city,#co-address{min-width:0 !important;width:100% !important}
  /* botões: inteiros, sem espaço sobrando exagerado */
  .brand-page button,.brand-page a.btn,.mw-btn,.cta,.buy-btn{max-width:100%;white-space:normal;word-break:break-word}
  /* grids de produto: 2 colunas no mobile, mais no tablet */
  .prod-grid,.cat-grid,.results-grid{grid-template-columns:repeat(2,1fr) !important;gap:10px !important}
}
@media(max-width:640px){
  .brand-page{padding-left:12px !important;padding-right:12px !important}
  .eyebrow{font-size:11px;letter-spacing:1.5px !important}
  .sec-title{font-size:clamp(28px,9vw,44px)}
  .veh-mq-tile{flex:1 1 calc(50% - 8px) !important}
  #cat-exhausts .fz-brandcard{flex:1 1 100% !important}
  .prod-grid,.cat-grid,.results-grid{grid-template-columns:1fr 1fr !important;gap:8px !important}
}
@media(min-width:641px) and (max-width:1024px){
  /* tablet: 3 colunas nos grids de produto, 3 nos tiles */
  .veh-mq-tile{flex:1 1 calc(33.33% - 10px) !important}
  .prod-grid,.cat-grid,.results-grid{grid-template-columns:repeat(3,1fr) !important}
}
@media(max-width:640px){
  /* BORRÃO PRETO, remove o espaço vazio gigante do topo (seletor forte) */
  section.brand-page{padding-top:54px !important}
  section.brand-page > .section-body,.brand-page > .section-body{padding-top:8px !important}
  #about.brand-page > .section-body,#about .section-body{padding-top:12px !important}
  #cat-catalog .section-body,#catalog .section-body{padding-top:0 !important}
}
/* =========================================================
   REFINAMENTO VISUAL, elementos INTERNOS proporcionais
   (ícones de marca, fontes, padding menores no mobile/tablet)
   ========================================================= */
@media(max-width:640px){
  /* --- cards de marca (mw-card) --- */
  .mw-card{padding:12px 8px !important;gap:6px !important;min-height:128px !important;border-radius:12px}
  .mw-ico{width:52px !important;height:42px !important;padding:5px !important}
  .mw-cname{font-size:12.5px !important;line-height:1.1}
  .mw-cdesc{font-size:9.5px !important;line-height:1.2}
  /* --- tiles de veículo (find by brand) --- */
  .veh-mq-tile{padding:12px 8px !important;gap:6px;min-height:132px}
  .veh-mq-ico{width:60px !important;height:44px !important;padding:5px !important}
  .veh-mq-name{font-size:12px !important;max-width:100%}
  .veh-mq-tag{font-size:9.5px !important}
  /* --- cards de marca de escapamento --- */
  #cat-exhausts .fz-brandcard{padding:12px !important;border-radius:12px}
  #cat-exhausts .fz-bc-logo{height:64px !important;margin-bottom:8px !important;border-radius:8px}
  #cat-exhausts .fz-bc-name{font-size:15px !important}
  #cat-exhausts .fz-bc-sub{font-size:10.5px !important}
  /* --- títulos e contadores --- */
  .sec-title{font-size:clamp(26px,8.5vw,40px) !important}
  .sec-count{font-size:12px !important}
  /* --- botões e chips proporcionais --- */
  .bchip{font-size:11px !important;padding:5px 9px !important}
  .adv-crumb b{font-size:12px}
  /* --- ícones de header (conta/carrinho) menores --- */
  #capa .acct-icon-btn,.hdr-icon-btn{transform:scale(.9);transform-origin:right center}
}
@media(min-width:641px) and (max-width:1024px){
  /* tablet: elementos internos em ~80% */
  .mw-card{padding:16px 12px !important;min-height:160px}
  .mw-ico{width:68px !important;height:54px !important}
  .mw-cname{font-size:14px !important}
  .veh-mq-ico{width:80px !important;height:52px !important}
  .veh-mq-name{font-size:14px !important}
  #cat-exhausts .fz-bc-logo{height:90px !important}
  #cat-exhausts .fz-bc-name{font-size:17px !important}
}

/* bloco 3 */

/* ===== MOBILE / TABLET (só telas estreitas, não afeta desktop) ===== */
@media (max-width: 820px){
  /* header: logo menor, ações compactas, idioma menor */
  .logo, .menu-logo{ max-width:150px !important; }
  .hdr-actions{ top:12px !important; right:10px !important; gap:8px !important; }
  .acct-icon-btn, .cart-icon-btn{ padding:8px 10px !important; font-size:12px !important; }
  #blplang{ top:8px !important; }
  #blplang .lg-btn{ padding:5px 10px !important; font-size:12px !important; }
  /* botões Main menu / Back menores */
  .back-btn, .mainmenu-btn{ padding:8px 12px !important; font-size:12px !important; }
  /* títulos de seção menores */
  .sec-title{ font-size:38px !important; }
  .eyebrow{ font-size:12px !important; }
  .band-video{ height:170px !important; }
  .section-body{ padding-left:16px !important; padding-right:16px !important; }
  /* filtros em 1 coluna */
  .filter-grid{ grid-template-columns:1fr 1fr !important; }
  .dyno-grid, .dyno-sel, .adm-grid2{ grid-template-columns:1fr !important; }
  /* tabelas: rolar na horizontal + fonte menor */
  .prod-table-wrap, .adm-table, table.prod-table{ display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .prod-table, .adm-table{ font-size:12px !important; min-width:640px; }
  /* grades de marca/modelo */
  .mw-list{ grid-template-columns:repeat(auto-fill,minmax(120px,1fr)) !important; }
  .vehm-models{ grid-template-columns:repeat(auto-fill,minmax(130px,1fr)) !important; }
  /* player de música menor e não cobrindo tudo */
  .trax{ transform:scale(.82); transform-origin:bottom left; }
  /* mini-carrinho ocupa quase a tela */
  .cart-mini{ width:92vw !important; right:-6px !important; }
  /* painel admin: sidebar em cima, conteúdo embaixo */
  #cat-admin .adm-wrap, .adm-layout{ flex-direction:column !important; }
}
@media (max-width: 500px){
  /* capa: carrossel e rótulos menores */
  #capa .mitem{ transform:scale(.8); }
  #capa .lbl{ font-size:11px !important; }
  #capa .mm-title{ font-size:34px !important; }
  .sec-title{ font-size:30px !important; }
  /* header ainda mais compacto: esconder texto, deixar só ícones */
  .acct-icon-btn .acct-icon-label, .cart-icon-btn .cart-icon-label{ display:none !important; }
  .acct-icon-btn, .cart-icon-btn{ padding:9px !important; border-radius:50% !important; }
  #blplang .lg-btn span:not(.lg-flag){ display:none; } /* mostra só a bandeira */
  /* idioma reposicionado à esquerda do cluster de ações, sem colidir */
  #blplang{ left:auto !important; right:186px !important; top:14px !important; transform:none !important; }
  #blplang .lg-btn{ padding:6px 10px !important; }
  #blplang .lg-menu{ left:auto !important; right:0 !important; transform:none !important; }
  /* ações do header com espaçamento certo, ícones proporcionais */
  .hdr-actions{ top:12px !important; right:10px !important; gap:6px !important; }
  .acct-icon-btn,.cart-icon-btn,.notif-btn{ width:42px !important; height:42px !important; padding:0 !important; justify-content:center !important; }
  .acct-caret{ width:22px !important; height:42px !important; }
  .logo, .menu-logo{ max-width:120px !important; }
  .filter-grid{ grid-template-columns:1fr !important; }
  .dyno-nums{ flex-wrap:wrap; }
  .dyno-nums>div{ min-width:30%; }
  .band-video{ height:170px !important; }
  /* dyno splits já viram 1 coluna via regra existente */
}

/* bloco 4 */

.vid-gallery{max-width:1150px;margin:26px auto 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}
.vid-card{position:relative;border-radius:14px;overflow:hidden;cursor:pointer;border:1px solid #23262d;background:#0d0e11;aspect-ratio:16/9;transition:.2s}
.vid-card:hover{border-color:#F2C230;transform:translateY(-3px)}
.vid-card img{width:100%;height:100%;object-fit:cover;display:block;opacity:.9}
.vid-card .vc-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.vid-card .vc-play svg{width:58px;height:58px;filter:drop-shadow(0 3px 10px #000);opacity:.95}
.vid-card .vc-tt{position:absolute;left:0;right:0;bottom:0;padding:16px 14px 12px;background:linear-gradient(transparent,rgba(0,0,0,.85));color:#fff;font-family:'Oswald';font-weight:600;font-size:15px}
.vid-card .vc-dur{position:absolute;top:10px;right:10px;background:rgba(0,0,0,.7);color:#fff;font-size:11px;padding:3px 7px;border-radius:5px}
#vid-modal{position:fixed;inset:0;z-index:10070;background:rgba(0,0,0,.92);display:none;align-items:center;justify-content:center;padding:20px}
#vid-modal.on{display:flex}
#vid-modal .vm-inner{width:min(1100px,96vw);position:relative}
#vid-modal video{width:100%;border-radius:10px;background:#000;max-height:82vh}
#vid-modal .vm-title{color:#eee;font-family:'Oswald';margin-top:10px;font-size:15px}
#vid-modal .vm-bar{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap}
#vid-modal .vm-ctrl{background:rgba(255,255,255,.08);border:1px solid var(--line);color:#fff;font-family:'Oswald',sans-serif;font-size:13px;padding:9px 16px;border-radius:8px;cursor:pointer;transition:.2s}
#vid-modal .vm-ctrl:hover{border-color:var(--yellow);color:var(--yellow)}
#vid-modal .vm-ctrl.muted{background:rgba(210,31,31,.18);border-color:var(--red);color:#ff9a9a}
#vid-modal .vm-x{position:absolute;top:-42px;right:0;background:none;border:none;color:#fff;font-size:34px;cursor:pointer}

/* bloco 5 */

#cat-wheels .wheels-notice{max-width:760px;margin:16px auto 4px;background:rgba(138,110,242,.12);border:1px solid rgba(138,110,242,.45);color:#c9bcff;border-radius:10px;padding:11px 18px;font-size:14px;text-align:center;font-family:Oswald,sans-serif}

/* bloco 6 */

.prod-table-wrap.cards-mode{max-height:none;overflow:visible;border:1px solid var(--line);border-radius:12px;max-width:1200px;padding:16px}
.prod-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;padding:2px}
@media(max-width:1100px){.prod-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:900px){.prod-grid{grid-template-columns:repeat(3,1fr);gap:10px}}
.prod-card{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--card,#111318);display:flex;flex-direction:column;transition:.18s;position:relative}
.prod-card .pc-promo{position:absolute;top:10px;left:10px;z-index:3;background:linear-gradient(135deg,#D21F1F,#ff4d4d);color:#fff;font-family:'Racing Sans One',sans-serif;font-size:15px;padding:5px 12px;border-radius:8px;box-shadow:0 6px 16px -4px rgba(210,31,31,.7);transform:rotate(-4deg);letter-spacing:.5px}
.prod-card .pc-old{color:#8a8f98;text-decoration:line-through;font-size:14px;font-family:'Oswald',sans-serif}
.prod-card .pc-now{color:#ff5252}
@media(prefers-reduced-motion:reduce){*{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important}}
.prod-card:hover{border-color:var(--gold);transform:translateY(-3px);box-shadow:0 14px 34px rgba(0,0,0,.5)}
.prod-card .pc-ph{aspect-ratio:1/1;background:#f4f4f5;overflow:hidden;cursor:zoom-in}
.prod-card .pc-ph img{width:100%;height:100%;object-fit:cover;transition:.3s}
.prod-card:hover .pc-ph img{transform:scale(1.05)}
.prod-card .pc-noimg{display:flex;align-items:center;justify-content:center;background:#1a1c22;color:#F2C230;font-family:'Racing Sans One',sans-serif;font-size:40px}
.prod-card .pc-body{padding:13px 14px;display:flex;flex-direction:column;gap:5px;flex:1}
.prod-card .pc-brand{font-size:10px;letter-spacing:1px;color:var(--gold);text-transform:uppercase}
.prod-card .pc-code{font-size:11px;color:#6b7078;font-family:monospace}
.prod-card .pc-name{font-size:13.5px;font-weight:600;line-height:1.3;min-height:34px;color:#e8e8ea}
.prod-card .pc-stock{font-size:11px}
.prod-card .pc-stock.ready{color:#4ade80}.prod-card .pc-stock.made{color:#f0b34a}
.prod-card .pc-price{font-family:'Racing Sans One',sans-serif;font-size:19px;color:#fff;margin-top:1px}
.prod-card .pc-btns{display:flex;gap:8px;margin-top:auto;padding-top:9px}
.prod-card .pc-add{flex:1;background:var(--red);border:none;color:#fff;border-radius:22px;padding:9px 8px;font-family:Oswald;font-weight:600;cursor:pointer;font-size:13px}
.prod-card .pc-add:hover{background:#b91a1a}
.prod-card .pc-view{background:#1b1e24;border:1px solid #2a2e36;color:#fff;border-radius:22px;padding:9px 14px;cursor:pointer;font-size:13px;font-family:Oswald}
.prod-card .pc-view:hover{border-color:var(--gold)}
@media(max-width:640px){.prod-grid{grid-template-columns:repeat(2,1fr) !important;gap:10px}.prod-card .pc-name{font-size:12.5px;line-height:1.3;min-height:32px}.prod-card .pc-price{font-size:17px}.prod-card .pc-body{padding:11px}.prod-card .pc-brand{font-size:10px}.prod-card .pc-code{font-size:10px}
  /* botões empilhados: cada um numa linha só, sem quebrar palavra, altura proporcional */
  .prod-card .pc-btns{flex-direction:column !important;gap:6px !important;padding-top:8px}
  .prod-card .pc-add,.prod-card .pc-view{width:100% !important;min-height:0 !important;padding:10px 8px !important;font-size:12.5px !important;white-space:nowrap !important;text-align:center;line-height:1.1 !important}
}
@media(min-width:641px) and (max-width:900px){.prod-grid{grid-template-columns:repeat(3,1fr) !important}}
@media(max-width:400px){.prod-grid{grid-template-columns:repeat(3,1fr);gap:6px}}

/* bloco 7 */

.prod-pager{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;max-width:1200px;margin:18px auto 0}
.prod-pager-top{margin:0 auto 14px}
@media(max-width:600px){.prod-pager{gap:4px}.prod-pager .pg-btn{padding:7px 10px;font-size:12px}.prod-pager .pg-info{width:100%;text-align:center;order:9}}
.prod-pager .pg-btn{min-width:38px;height:38px;padding:0 10px;background:#14161b;border:1px solid #2a2e36;color:#e8e8ea;border-radius:9px;cursor:pointer;font-family:Oswald,sans-serif;font-size:14px}
.prod-pager .pg-btn:hover:not(:disabled){border-color:var(--gold,#F2C230)}
.prod-pager .pg-btn.on{background:var(--gold,#F2C230);color:#111;border-color:var(--gold,#F2C230);font-weight:700}
.prod-pager .pg-btn:disabled{opacity:.35;cursor:default}
.prod-pager .pg-dots{color:#8a8f98;padding:0 2px}
.prod-pager .pg-info{color:#8a8f98;font-size:12px;margin-left:10px}

/* bloco 8 */

#checkout-upsell .up-wrap{border:1px solid rgba(242,194,48,.4);background:rgba(242,194,48,.05);border-radius:12px;padding:14px;margin-bottom:18px}
#checkout-upsell .up-title{font-family:Oswald;font-weight:600;color:#F2C230;margin-bottom:10px;font-size:15px}
#checkout-upsell .up-card{display:flex;gap:12px;align-items:center;background:#111318;border:1px solid #23262d;border-radius:10px;padding:10px;margin-bottom:8px}
#checkout-upsell .up-card img{width:70px;height:70px;object-fit:cover;border-radius:8px;flex:none}
#checkout-upsell .up-body{flex:1;min-width:0}
#checkout-upsell .up-name{font-weight:600;color:#fff;font-size:14px}
#checkout-upsell .up-year{font-size:11px;color:#8a8f98}
#checkout-upsell .up-desc{font-size:12px;color:#9aa0a8;margin-top:3px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#checkout-upsell .up-side{display:flex;flex-direction:column;align-items:flex-end;gap:7px;flex:none}
#checkout-upsell .up-price{font-family:Racing Sans One;color:#F2C230;font-size:16px}
#checkout-upsell .up-free{color:#4ade80;font-weight:700;font-size:12px}
#checkout-upsell .up-add{background:#D21F1F;border:none;color:#fff;border-radius:20px;padding:8px 14px;cursor:pointer;font-family:Oswald;font-size:12px;white-space:nowrap}
#checkout-upsell .up-add.done{background:#1b3a24;color:#4ade80;border:1px solid #2a5a38;cursor:default}
@media(max-width:640px){
  /* card de jogo no checkout: imagem+nome em cima, tag+botão embaixo (full-width) */
  #checkout-upsell .up-card{flex-wrap:wrap;gap:10px;padding:12px}
  #checkout-upsell .up-card img{width:54px;height:54px}
  #checkout-upsell .up-body{flex:1 1 calc(100% - 66px);min-width:0}
  #checkout-upsell .up-name{font-size:13.5px;line-height:1.3;white-space:normal;overflow-wrap:normal;word-break:normal}
  #checkout-upsell .up-desc{display:none}
  #checkout-upsell .up-side{flex:1 1 100%;flex-direction:row;justify-content:space-between;align-items:center;gap:10px;margin-top:2px}
  #checkout-upsell .up-add{min-height:40px;padding:9px 16px;font-size:13px;flex:1;max-width:170px;text-align:center}
  #checkout-upsell .up-free,#checkout-upsell .up-price{font-size:13px}
}

/* bloco 9 */

body:has(#capa:not(.entered)){overflow-x:hidden!important;overflow-y:hidden!important;height:100vh!important;height:100dvh!important;overscroll-behavior:none!important}

/* bloco 10 */

#wheels-app .wheels-catalog{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:18px 0}
.wh-price{margin:14px 0 6px;padding:16px 18px;border-radius:12px;background:linear-gradient(180deg,rgba(242,194,48,.08),rgba(255,255,255,.02));border:1px solid rgba(242,194,48,.35)}
.wh-price .wp-per{color:#c9cdd6;font-size:13px}
.wh-price .wp-total{font-family:'Racing Sans One',sans-serif;color:var(--yellow);font-size:26px;line-height:1.1;margin:2px 0}
.wh-price .wp-split{color:#9aa0aa;font-size:12px;margin-top:4px}
.wh-price.wp-na{background:rgba(210,31,31,.08);border-color:rgba(210,31,31,.4)}
.wh-price.wp-na .wp-total{color:#ff9a9a;font-size:16px}
@media(max-width:820px){#wheels-app .wheels-catalog{grid-template-columns:1fr}}
.wl-card{display:flex;gap:0;background:#111318;border:1px solid #23262d;border-radius:14px;overflow:hidden;cursor:pointer;transition:.18s}
.wl-card:hover{border-color:#F2C230;transform:translateY(-2px)}
.wl-card .wl-img{flex:0 0 42%;background:#000}
.wl-card .wl-img img{width:100%;height:100%;object-fit:cover;display:block}
.wl-card .wl-body{padding:15px}
.wl-card .wl-kicker{font-size:10px;letter-spacing:1px;color:#F2C230;text-transform:uppercase}
.wl-card h3{margin:2px 0 6px;font-family:'Racing Sans One';color:#fff;font-size:18px}
.wl-card p{color:#9aa0a8;font-size:12.5px;line-height:1.45;margin:0 0 8px}
.wl-card ul{margin:0 0 10px;padding-left:16px;color:#c9ccd2;font-size:12px}
.wl-card .wl-cta{color:#F2C230;font-size:12.5px;font-weight:600}
.wl-head{display:flex;align-items:center;gap:14px;margin:6px 0 14px}
.wl-head h3{font-family:'Racing Sans One';color:#fff;margin:0}
.wheels-designs{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media(max-width:640px){.wheels-designs{grid-template-columns:repeat(2,1fr);gap:8px}}
#wheels-showcase{margin:34px 0 8px}
#wheels-showcase .wsc-title{font-family:'Racing Sans One',sans-serif;color:var(--yellow);font-size:clamp(20px,2.4vw,26px);text-align:center}
#wheels-showcase .wsc-sub{text-align:center;color:#9aa0aa;font-size:13px;margin:2px 0 16px}
#wheels-showcase .wsc-filters{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-bottom:16px}
#wheels-showcase .wsc-types{display:flex;flex-wrap:wrap;gap:8px}
#wheels-showcase .wsc-chip{cursor:pointer;font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:1px;font-size:12px;color:#d7dae0;padding:8px 16px;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:rgba(255,255,255,.02);transition:.15s}
#wheels-showcase .wsc-chip:hover{border-color:var(--yellow)}
#wheels-showcase .wsc-chip.on{background:var(--yellow);color:#0c0c0c;border-color:var(--yellow);font-weight:600}
#wheels-showcase .wsc-search{background:#0c0d10;border:1px solid var(--line);border-radius:999px;color:#fff;padding:9px 16px;font-family:'Oswald',sans-serif;font-size:13px;min-width:200px}
#wheels-showcase .wsc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media(max-width:900px){#wheels-showcase .wsc-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){#wheels-showcase .wsc-grid{grid-template-columns:repeat(2,1fr);gap:8px}}
@media(max-width:640px){#wheels-showcase .wsc-types{display:grid;grid-template-columns:1fr 1fr;gap:6px}#wheels-showcase .wsc-chip{font-size:11px;padding:8px 10px;text-align:center}#wheels-showcase .wsc-filters{flex-direction:column;align-items:stretch}#wheels-showcase .wsc-search{min-width:0;width:100%}}
#wheels-showcase .wsc-card{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:12px;overflow:hidden;cursor:pointer;transition:.15s;display:flex;flex-direction:column}
#wheels-showcase .wsc-card:hover{border-color:var(--yellow);transform:translateY(-2px)}
#wheels-showcase .wsc-ph{aspect-ratio:1/1;background:#0c0d10;display:flex;align-items:center;justify-content:center;overflow:hidden}
#wheels-showcase .wsc-ph img{width:100%;height:100%;object-fit:contain}
#wheels-showcase .wsc-b{padding:12px 14px;display:flex;flex-direction:column;gap:3px;flex:1}
#wheels-showcase .wsc-name{font-family:'Racing Sans One',sans-serif;color:#fff;font-size:16px;letter-spacing:.5px}
#wheels-showcase .wsc-type{color:#9aa0aa;font-size:12px;text-transform:uppercase;letter-spacing:1px}
#wheels-showcase .wsc-price{color:var(--yellow);font-family:'Oswald',sans-serif;font-weight:600;font-size:14px;margin-top:2px}
#wheels-showcase .wsc-btn{margin-top:8px;background:var(--red);color:#fff;border:none;border-radius:8px;padding:9px 0;font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:1px;font-size:12px;cursor:pointer}
#wheels-showcase .wsc-btn:hover{filter:brightness(1.1)}
#wheels-showcase .wsc-more{text-align:center;color:#8a8f98;font-size:13px;margin-top:16px;font-family:'Oswald',sans-serif}
.wd2{background:#111318;border:1px solid #23262d;border-radius:12px;overflow:hidden;cursor:pointer;transition:.18s}
.wd2:hover{border-color:#F2C230;transform:translateY(-3px)}
.wd2 .wd2-ph{aspect-ratio:1/1;background:#f4f4f5;display:flex;align-items:center;justify-content:center;overflow:hidden}
.wd2 .wd2-ph img{width:100%;height:100%;object-fit:cover}
.wd2 .wd2-soon{color:#888;font-size:12px}
.wd2 .wd2-b{padding:11px}
.wd2 .wd2-code{font-family:'Racing Sans One';color:#fff;font-size:15px}
.wd2 .wd2-price{color:#F2C230;font-size:12px;margin:2px 0 8px}
.wd2 .wd2-btn{width:100%;background:#D21F1F;border:none;color:#fff;border-radius:20px;padding:8px;cursor:pointer;font-family:Oswald;font-weight:600;font-size:13px}

/* bloco 11 */

/* o convite do Expert Guide aparece por cima da tela inicial */
#welcome-ov{z-index:10120 !important}

/* ===================================================================
   BLACKLIST, DESIGN SYSTEM UNIFICADO (polish global v2)
   Padroniza sidebars, botões, inputs, cards e modais em todo o site.
   =================================================================== */
:root{--bl-radius:11px;--bl-gold:#F2C230;--bl-red:#D21F1F;--bl-green:#2ec77a;--bl-ink:#0d0e10;--bl-card:#141416;--bl-line:rgba(255,255,255,.10);--bl-line2:rgba(255,255,255,.16);--bl-mut:#9aa0aa}

/* ---- BOTÕES (todos os painéis) ---- */
.adm-btn,.sec-btn,.acct-save,.filter-btn,.auth-btn{
  font-family:'Oswald',sans-serif;font-weight:600;letter-spacing:.5px;text-transform:uppercase;
  border:none;border-radius:10px;cursor:pointer;transition:.16s ease;line-height:1;
}
.adm-btn{background:var(--bl-gold);color:#141414;padding:10px 16px;font-size:12px;box-shadow:0 4px 12px -6px rgba(242,194,48,.5)}
.adm-btn:hover{filter:brightness(1.06);transform:translateY(-1px)}
.adm-btn:active{transform:translateY(0)}
.adm-btn.ghost{background:transparent;border:1px solid var(--bl-line2);color:#e2e4e8;box-shadow:none}
.adm-btn.ghost:hover{border-color:var(--bl-gold);color:#fff;background:rgba(242,194,48,.06)}
.adm-btn.red{background:var(--bl-red);color:#fff;box-shadow:0 4px 12px -6px rgba(210,31,31,.6)}
.adm-btn.green{background:var(--bl-green);color:#062b18;box-shadow:0 4px 12px -6px rgba(46,199,122,.6)}
.acct-save{background:var(--bl-gold);color:#141414;padding:12px 26px;font-size:13px;box-shadow:0 6px 16px -8px rgba(242,194,48,.6)}
.acct-save:hover{filter:brightness(1.06);transform:translateY(-1px)}
.sec-btn{background:var(--bl-red);color:#fff;padding:12px 18px;font-size:13px;box-shadow:0 6px 16px -8px rgba(210,31,31,.6)}
.sec-btn:hover{filter:brightness(1.08);transform:translateY(-1px)}
.sec-btn.ghost{background:transparent;border:1px solid var(--bl-line2);color:#e2e4e8;box-shadow:none}

/* ---- INPUTS / SELECTS (todos os painéis) ---- */
.adm-in,.ig-in,.adm-sel,#margin-body .mg-in,#promos-body .promo-in,
.acct-card input,.acct-card select,.acct-card textarea{
  background:var(--bl-card)!important;border:1px solid var(--bl-line2)!important;border-radius:9px!important;
  color:#fff!important;font-family:'Oswald',sans-serif!important;font-size:14px;padding:11px 13px;transition:.15s;
}
.adm-in:focus,.ig-in:focus,.adm-sel:focus,#margin-body .mg-in:focus,#promos-body .promo-in:focus,
.acct-card input:focus,.acct-card select:focus,.acct-card textarea:focus{
  outline:none!important;border-color:var(--bl-gold)!important;box-shadow:0 0 0 3px rgba(242,194,48,.14)!important;
}
select.adm-in,select.ig-in,.adm-sel{cursor:pointer}

/* ---- CARDS DE PAINEL ---- */
.adm-card{background:rgba(255,255,255,.025)!important;border:1px solid var(--bl-line)!important;border-radius:14px!important;padding:20px 22px!important;margin-bottom:16px}
.adm-card h3{font-family:'Racing Sans One',sans-serif;color:var(--bl-gold);font-size:16px;margin:0 0 6px;display:flex;align-items:center;gap:8px}
.adm-card .hint{color:var(--bl-mut);font-size:12.5px;line-height:1.55;margin-bottom:12px}

/* ---- SIDEBARS (admin + conta) unificadas ---- */
.acct-side,.adm-side{background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.015))!important;border:1px solid var(--bl-line)!important;border-radius:16px!important;padding:18px!important;box-shadow:0 20px 50px -30px rgba(0,0,0,.9)}
/* AUDITORIA: menu lateral (conta/admin) nunca some nem fica sob barras fixas */
@media(min-width:901px){
  .acct-side,.adm-side{max-height:calc(100vh - 110px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
  .acct-side::-webkit-scrollbar,.adm-side::-webkit-scrollbar{width:6px}
  .acct-side::-webkit-scrollbar-thumb,.adm-side::-webkit-scrollbar-thumb{background:rgba(255,255,255,.16);border-radius:3px}
}
@media(max-width:900px){
  .adm-side,.acct-side{top:66px !important;max-height:calc(100vh - 82px) !important;padding-bottom:58px !important}
}
@media(max-width:640px){
  .adm-side,.acct-side{top:62px !important;max-height:calc(100vh - 76px) !important}
}
.acct-nav button,.adm-side button{
  text-align:left;width:100%;padding:11px 14px;background:transparent;border:none;border-radius:10px;
  color:#cfd2d8;font-family:'Oswald',sans-serif;font-size:14px;letter-spacing:.4px;cursor:pointer;transition:.15s;
  display:flex;align-items:center;gap:11px;margin-bottom:2px;
}
.acct-nav button svg,.adm-side button svg{width:17px;height:17px;flex:none;opacity:.85;stroke:currentColor}
.acct-nav button:hover,.adm-side button:hover{background:rgba(255,255,255,.06);color:#fff}
.acct-nav button.on,.adm-side button.on,.adm-side button.active{
  background:linear-gradient(135deg,var(--bl-gold),#ffd968)!important;color:#141414!important;font-weight:600;
  box-shadow:0 6px 16px -8px rgba(242,194,48,.6);
}
.acct-nav button.on svg,.adm-side button.on svg{opacity:1}
.acct-nav button.danger,.adm-side button.danger,.acct-nav button.on.danger{color:#ff6b6b}

/* ---- MODAIS (auth / margin / promos / help) ---- */
.auth-modal{border-radius:18px!important;border:1px solid var(--bl-line)!important;box-shadow:0 40px 100px -30px rgba(0,0,0,.9)!important}
.auth-x,.margin-x,.help-x{transition:.15s}
.auth-x:hover,.margin-x:hover{transform:rotate(90deg);filter:brightness(1.1)}
.auth-logo{font-family:'Racing Sans One',sans-serif}

/* ---- TABELAS de painel ---- */
.adm-table th,.mg-table th{font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:1px;font-size:10px;color:var(--bl-mut)!important;background:rgba(255,255,255,.02)}
.adm-table td,.mg-table td{color:#dfe2e7}
.adm-table tbody tr:hover td,.mg-table tbody tr:hover td{background:rgba(242,194,48,.04)}

/* ---- scrollbar discreta nos painéis ---- */
#margin-body ::-webkit-scrollbar,#promos-body ::-webkit-scrollbar,.auth-inner ::-webkit-scrollbar{width:9px;height:9px}
#margin-body ::-webkit-scrollbar-thumb,.auth-inner ::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14);border-radius:8px}

/* bloco 12 */

/* ===== SPLASH DA LOGO (primeira coisa a aparecer; mascara o flash do menu antes do video) ===== */
#blp-logo-splash{position:fixed;inset:0;z-index:2147483647;background:radial-gradient(ellipse 90% 70% at center,#181818 0%,#0a0a0b 55%,#000 100%);display:flex;align-items:center;justify-content:center;overflow:hidden;opacity:1;transition:opacity .8s ease}
#blp-logo-splash.bls-out{opacity:0;pointer-events:none}
#blp-logo-splash .bls-glow{position:absolute;width:130vw;height:70vh;background:radial-gradient(ellipse at center,rgba(242,194,48,.20) 0%,rgba(242,194,48,.12) 28%,rgba(242,194,48,.05) 48%,rgba(242,194,48,.015) 62%,transparent 76%);animation:blsGlow 2.6s ease-in-out infinite;pointer-events:none}
#blp-logo-splash .bls-inner{position:relative;display:flex;align-items:center;justify-content:center;will-change:transform,opacity,filter;animation:blsIn 1.05s cubic-bezier(.16,.9,.24,1) both}
#blp-logo-splash.bls-out .bls-inner{animation:blsExit .82s cubic-bezier(.55,0,.75,.2) forwards}
#blp-logo-splash .bls-logo{position:relative;width:min(72vw,500px);max-width:90vw;height:auto;display:block}
#blp-logo-splash .bls-fallback{font-family:'Oswald',sans-serif;font-weight:800;letter-spacing:.05em;color:#F2C230;font-size:clamp(30px,10vw,60px);line-height:.98;text-align:center;text-shadow:0 0 26px rgba(242,194,48,.35);max-width:92vw}
#blp-logo-splash .bls-fallback span{display:block;font-size:.42em;letter-spacing:.32em;font-weight:600;margin-top:.4em;color:rgba(242,194,48,.9)}
#blp-logo-splash .bls-shine{position:absolute;inset:0;overflow:hidden;pointer-events:none}
#blp-logo-splash .bls-shine::before{content:"";position:absolute;top:-40%;left:-70%;width:42%;height:180%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-18deg);animation:blsShine 1.6s cubic-bezier(.3,.1,.3,1) .55s 1 both}
#blp-logo-splash .bls-tag{position:absolute;bottom:16vh;left:0;right:0;text-align:center;font-family:'Oswald',sans-serif;font-weight:600;letter-spacing:.34em;font-size:clamp(9px,2.6vw,13px);color:rgba(242,194,48,.85);text-transform:uppercase;animation:blsTag 1s ease .5s both}
@keyframes blsIn{0%{opacity:0;transform:scale(.7);filter:blur(11px) drop-shadow(0 0 0 rgba(242,194,48,0))}55%{opacity:1;filter:blur(0) drop-shadow(0 0 28px rgba(242,194,48,.32))}100%{opacity:1;transform:scale(1);filter:blur(0) drop-shadow(0 0 20px rgba(242,194,48,.2))}}
@keyframes blsExit{0%{opacity:1;transform:scale(1);filter:blur(0)}100%{opacity:0;transform:scale(1.4);filter:blur(7px)}}
@keyframes blsGlow{0%,100%{opacity:.5;transform:scale(.95)}50%{opacity:1;transform:scale(1.05)}}
@keyframes blsShine{0%{left:-70%}100%{left:150%}}
@keyframes blsTag{0%{opacity:0;transform:translateY(10px)}100%{opacity:.85;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){#blp-logo-splash .bls-logo,#blp-logo-splash .bls-glow,#blp-logo-splash .bls-shine::before,#blp-logo-splash .bls-tag{animation:none}}

/* bloco 13 */
.bpu-coupon{display:flex;width:100%;border:1px solid rgba(255,255,255,.16);border-radius:10px;overflow:hidden;background:#0c0d10;transition:border-color .15s}.bpu-coupon:focus-within{border-color:rgba(242,194,48,.7)}.bpu-coupon input{flex:1;min-width:0;border:0!important;background:transparent!important;box-shadow:none!important;outline:0;padding:12px 14px!important;color:#fff;font:500 14px Oswald,sans-serif;letter-spacing:1.2px;text-transform:uppercase;margin:0!important;border-radius:0!important}.bpu-coupon input::placeholder{text-transform:none;letter-spacing:.3px;color:#6f747c}.bpu-coupon button{flex:none;border:0;border-left:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:#F2C230;font:600 13px Oswald,sans-serif;letter-spacing:1px;text-transform:uppercase;padding:0 20px;cursor:pointer;transition:background .15s}.bpu-coupon button:hover{background:rgba(242,194,48,.12)}#co-coupon-msg{font-family:Oswald,sans-serif}
/* bloco 14 */

#capa .capa-smoke{position:absolute;inset:0;z-index:6;pointer-events:none;overflow:hidden;mix-blend-mode:screen;opacity:.5}
#capa .capa-smoke span{position:absolute;bottom:-20%;width:60vmax;height:60vmax;border-radius:50%;
  background:radial-gradient(circle at 50% 50%, rgba(200,200,210,.22), rgba(160,160,170,.08) 45%, transparent 70%);
  filter:blur(20px);animation:smokeDrift 26s linear infinite}
#capa .capa-smoke span:nth-child(1){left:-10%;animation-duration:30s}
#capa .capa-smoke span:nth-child(2){left:30%;animation-duration:38s;animation-delay:-12s;opacity:.7}
#capa .capa-smoke span:nth-child(3){left:65%;animation-duration:34s;animation-delay:-20s}
@keyframes smokeDrift{0%{transform:translate(0,10%) scale(1);opacity:0}
  15%{opacity:.6}50%{transform:translate(8vw,-20%) scale(1.3);opacity:.5}
  85%{opacity:.3}100%{transform:translate(-4vw,-45%) scale(1.6);opacity:0}}

/* bloco 15 */

      .wh-order-flow{max-width:900px;margin:6px auto 4px}
      .wh-order-lead{color:#cfcfcf;font-size:16px;line-height:1.7;margin-bottom:22px;text-align:center}
      .wh-order-steps{list-style:none;margin:0;padding:0;display:grid;gap:14px}
      .wh-order-steps li{position:relative;padding:16px 18px 16px 60px;background:rgba(255,255,255,.03);
        border:1px solid rgba(242,194,48,.18);border-radius:12px;color:#cfcfcf;font-size:15px;line-height:1.6;counter-increment:whstep}
      .wh-order-steps li::before{content:counter(whstep);position:absolute;left:16px;top:14px;width:30px;height:30px;
        display:flex;align-items:center;justify-content:center;font-family:'Racing Sans One',sans-serif;font-size:16px;
        color:#0c0c0c;background:var(--yellow);border-radius:8px}
      .wh-order-steps{counter-reset:whstep}
      .wh-order-steps li b{color:#fff;font-weight:600}
      .wh-order-note{margin:22px auto 0;max-width:900px;padding:14px 18px;border-left:3px solid var(--yellow);
        background:rgba(242,194,48,.06);color:#e6e6e6;font-size:14px;line-height:1.6;border-radius:0 8px 8px 0}
      .wh-order-note b{color:var(--yellow);font-weight:600}
    
/* bloco 16 */

    #cat-exhausts .ex-notice{max-width:820px;margin:16px auto 4px;background:rgba(210,31,31,.10);border:1px solid rgba(210,31,31,.45);color:#ffd9d9;border-radius:10px;padding:12px 18px;font-size:14px;text-align:center;font-family:Oswald,sans-serif}
    #cat-exhausts .ex-banner{max-width:1180px;margin:26px auto;border-radius:14px;overflow:hidden;border:1px solid var(--line);box-shadow:0 26px 70px -30px rgba(0,0,0,.85);background:#0b0b0d}
    #cat-exhausts .ex-banner img{width:100%;height:auto;display:block}
    #cat-exhausts .ak-wrap, #cat-formulaz .ak-wrap{max-width:1180px;margin:22px auto 8px}
    #cat-exhausts .fz-brandrow{display:flex;gap:16px;overflow-x:auto;padding:6px 2px 18px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;max-width:1180px;margin:0 auto}
    #cat-exhausts .fz-brandcard{flex:0 0 auto;width:220px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:14px;padding:20px;text-align:center;cursor:pointer;scroll-snap-align:start;transition:.15s}
    #cat-exhausts .fz-brandcard:hover{border-color:var(--red);transform:translateY(-3px)}
    #cat-exhausts .fz-brandcard.soon{opacity:.55;cursor:default}
    #cat-exhausts .fz-bc-logo{width:100%;height:120px;background:#080808;border:1px solid rgba(255,255,255,.14);border-radius:10px;display:flex;align-items:center;justify-content:center;overflow:hidden;margin-bottom:14px}
    #cat-exhausts .fz-bc-logo img{width:88%;height:auto;object-fit:contain}
    #cat-exhausts .fz-bc-name{font-family:'Racing Sans One',cursive;color:#fff;font-size:20px}
    #cat-exhausts .fz-bc-tag{color:#9aa0aa;font-size:12px;margin:2px 0 10px}
    #cat-exhausts .fz-bc-cta{color:var(--red);font-family:'Oswald',sans-serif;font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:1px}
    #cat-exhausts .fz-banner video, #cat-formulaz .fz-banner video{width:100%;height:auto;display:block}
    #cat-exhausts .fz-gallery, #cat-formulaz .fz-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:1120px;margin:20px auto 0}
    #cat-exhausts .fz-gallery figure, #cat-formulaz .fz-gallery figure{margin:0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#0a0a0a}
    #cat-exhausts .fz-gallery img, #cat-formulaz .fz-gallery img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block;background:#0a0b0e}
    #cat-exhausts .fz-gallery figure.fz-v img, #cat-formulaz .fz-gallery figure.fz-v img{aspect-ratio:4/5}
    #cat-exhausts .fz-gallery figure.fz-wide, #cat-formulaz .fz-gallery figure.fz-wide{grid-column:span 2}
    #cat-exhausts .fz-gallery figure.fz-wide img, #cat-formulaz .fz-gallery figure.fz-wide img{aspect-ratio:21/9}
    #cat-exhausts .fz-gallery figcaption, #cat-formulaz .fz-gallery figcaption{padding:10px 12px;color:#b9bdc6;font-size:12.5px;line-height:1.5}
    @media(max-width:760px){#cat-exhausts .fz-gallery, #cat-formulaz .fz-gallery{grid-template-columns:1fr}#cat-exhausts .fz-gallery figure.fz-wide, #cat-formulaz .fz-gallery figure.fz-wide{grid-column:span 1}}
    #cat-exhausts .ak-banner, #cat-formulaz .ak-banner{border-radius:16px;overflow:hidden;border:1px solid rgba(210,31,31,.4);box-shadow:0 30px 80px -30px rgba(210,31,31,.35),0 20px 60px -30px #000}
    #cat-exhausts .ak-banner img{width:100%;height:auto;display:block}
    #cat-exhausts .ak-brand, #cat-formulaz .ak-brand{display:flex;gap:26px;align-items:flex-start;margin:26px 0 6px;flex-wrap:wrap}
    #cat-exhausts .ak-logo, #cat-formulaz .ak-logo{flex:0 0 auto;background:#fff;border-radius:14px;padding:22px 26px;width:230px;display:flex;align-items:center;justify-content:center;box-shadow:0 14px 40px -18px #000}
    #cat-exhausts .ak-logo img, #cat-formulaz .ak-logo img{width:100%;height:auto;display:block}
    #cat-exhausts .ak-txt, #cat-formulaz .ak-txt{flex:1;min-width:280px}
    #cat-exhausts .ak-eyebrow, #cat-formulaz .ak-eyebrow{color:var(--red);font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:3px;font-size:12px;font-weight:600}
    #cat-exhausts .ak-txt h3, #cat-formulaz .ak-txt h3{font-family:'Racing Sans One',sans-serif;color:#fff;font-size:clamp(26px,3vw,38px);margin:4px 0 12px;letter-spacing:1px}
    #cat-exhausts .ak-txt p, #cat-formulaz .ak-txt p{color:#c3c7cf;font-size:14.5px;line-height:1.7;margin:0 0 12px}
    #cat-exhausts .ak-txt .ak-today, #cat-formulaz .ak-txt .ak-today{color:#fff;border-left:3px solid var(--red);padding-left:14px}
    #cat-exhausts .ak-soon, #cat-formulaz .ak-soon{margin:26px 0 10px;padding:22px;border:1px dashed rgba(242,194,48,.4);border-radius:14px;background:rgba(242,194,48,.05)}
    #cat-exhausts .zp-carousel, #cat-formulaz .zp-carousel{display:flex;gap:14px;overflow-x:auto;padding:6px 2px 16px;scroll-snap-type:x proximity;cursor:grab;-webkit-overflow-scrolling:touch}
    #cat-exhausts .zp-carousel.drag, #cat-formulaz .zp-carousel.drag{cursor:grabbing}
    #cat-exhausts .zp-carousel::-webkit-scrollbar{height:8px}
    #cat-exhausts .zp-carousel::-webkit-scrollbar-thumb{background:rgba(242,194,48,.4);border-radius:4px}
    #cat-exhausts .zp-item, #cat-formulaz .zp-item{flex:0 0 auto;width:230px;aspect-ratio:9/16;max-height:360px;border-radius:12px;overflow:hidden;position:relative;border:1px solid var(--line);background:#0a0a0a;scroll-snap-align:start}
    #cat-exhausts .zp-item img, #cat-formulaz .zp-item img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
    #cat-exhausts .zp-play, #cat-formulaz .zp-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.15);transition:.15s}
    #cat-exhausts .zp-item:hover .zp-play{background:rgba(0,0,0,.35)}
    #cat-exhausts .zp-play span, #cat-formulaz .zp-play span{display:flex;align-items:center;justify-content:center;width:62px;height:62px;transition:transform .15s}
    #cat-exhausts .zp-play svg, #cat-formulaz .zp-play svg{width:100%;height:100%;display:block;filter:drop-shadow(0 3px 12px rgba(0,0,0,.65))}
    #cat-exhausts .zp-item:hover .zp-play span,#cat-formulaz .zp-item:hover .zp-play span{transform:scale(1.08)}
    @media(max-width:700px){#cat-exhausts .zp-play span,#cat-formulaz .zp-play span{width:52px;height:52px}}
    #zvid-ov{position:fixed;inset:0;z-index:100060;background:rgba(0,0,0,.9);display:none;align-items:center;justify-content:center;padding:20px}
    #zvid-ov.on{display:flex}
    #zvid-ov video{max-width:96vw;max-height:78vh;border-radius:12px;background:#000}
    #zvid-ov .zvid-inner{display:flex;flex-direction:column;align-items:center;gap:12px}
    #zvid-ov .zvid-vwrap{position:relative;display:inline-block;line-height:0}
    #zvid-ov .zvid-play{position:absolute;inset:0;margin:auto;width:180px;height:120px;background:rgba(210,31,31,.92);border:none;border-radius:16px;color:#fff;cursor:pointer;display:none;flex-direction:column;align-items:center;justify-content:center;gap:6px;box-shadow:0 12px 40px rgba(0,0,0,.6)}
    #zvid-ov .zvid-play.on{display:flex}
    #zvid-ov .zvid-play span{font-family:'Oswald',sans-serif;font-size:14px;font-weight:600;letter-spacing:.5px}
    #zvid-ov .zvid-play:hover{background:var(--red);transform:scale(1.04)}
    #zvid-ov .zvid-bar{display:flex;gap:10px}
    #zvid-ov .zvid-ctrl{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#fff;font-family:'Oswald',sans-serif;font-size:14px;padding:10px 18px;border-radius:9px;cursor:pointer;transition:.15s}
    #zvid-ov .zvid-ctrl:hover{border-color:var(--yellow);color:var(--yellow)}
    #zvid-ov .zvid-ctrl.muted{background:rgba(210,31,31,.2);border-color:var(--red);color:#ff9a9a}
    #zvid-ov .zvx{position:absolute;top:18px;right:22px;background:var(--red);color:#fff;border:none;width:40px;height:40px;border-radius:10px;font-size:20px;cursor:pointer}
    #cat-exhausts .ex-anchors{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:22px auto 8px}
    #cat-exhausts .ex-anchor-cta{background:rgba(210,31,31,.15);border-color:rgba(210,31,31,.5);color:#ff8a8a}
    #cat-exhausts .ex-anchor-cta.active{background:var(--red);color:#fff;border-color:var(--red)}
    /* request de escapamento */
    #cat-exhausts .exreq-brands{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:760px;margin:18px auto}
    #cat-exhausts .exreq-brand{background:rgba(255,255,255,.03);border:1.5px solid var(--line);border-radius:14px;padding:20px;cursor:pointer;transition:.15s;text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px}
    #cat-exhausts .exreq-brand:hover{border-color:var(--yellow);transform:translateY(-2px)}
    #cat-exhausts .exreq-brand.on{border-color:var(--yellow);background:rgba(242,194,48,.08);box-shadow:0 0 0 1px var(--yellow)}
    #cat-exhausts .exreq-brand img{height:40px;object-fit:contain;background:#fff;border-radius:8px;padding:6px 12px}
    #cat-exhausts .exreq-brand b{color:#fff;font-family:'Oswald',sans-serif;font-size:16px}
    #cat-exhausts .exreq-brand small{color:#9aa0aa;font-size:12px;line-height:1.4}
    #cat-exhausts .exreq-card{max-width:760px;margin:0 auto;background:rgba(0,0,0,.25);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:24px}
    /* modal de request (global) */
    #exreq-ov .exreq-brandhead{display:flex;align-items:center;gap:14px;margin-bottom:14px}
    #exreq-ov .exreq-brandhead img{height:38px;background:#fff;border-radius:8px;padding:5px 10px;object-fit:contain}
    #exreq-ov .exreq-eyebrow{color:var(--yellow);font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:2px;font-size:11px}
    #exreq-ov .exreq-modal-h{font-family:'Racing Sans One',sans-serif;color:#fff;font-size:22px}
    #exreq-ov .exreq-grid{display:grid;gap:12px}
    #exreq-ov .exreq-g2{grid-template-columns:1fr 1fr}
    #exreq-ov .exreq-g3{grid-template-columns:1fr 1fr 1fr}
    #exreq-ov .exreq-f{display:flex;flex-direction:column;margin-bottom:8px}
    #exreq-ov .exreq-f label{font-size:11px;letter-spacing:.5px;text-transform:uppercase;color:#bdbdbd;margin:0 0 5px}
    #exreq-ov .exreq-hint{text-transform:none;letter-spacing:0;color:#7a7f88;font-size:10px}
    #exreq-ov .exreq-f input,#exreq-ov .exreq-f select,#exreq-ov .exreq-f textarea{width:100%;background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#fff;font-family:'Oswald',sans-serif;font-size:14px;padding:10px 12px}
    #exreq-ov .exreq-f input:focus,#exreq-ov .exreq-f select:focus,#exreq-ov .exreq-f textarea:focus{outline:none;border-color:var(--yellow)}
    #exreq-ov .exreq-info{background:linear-gradient(180deg,rgba(242,194,48,.1),rgba(242,194,48,.02));border:1px solid rgba(242,194,48,.3);border-radius:10px;padding:12px 14px;margin:6px 0 10px;font-size:12px;color:#e8e2cf;line-height:1.5}
    #exreq-ov .exreq-info b{color:var(--yellow)}
    #exreq-ov .exreq-btn{width:100%;margin-top:6px;background:var(--red);border:none;border-radius:10px;color:#fff;font-family:'Racing Sans One',sans-serif;font-size:15px;text-transform:uppercase;letter-spacing:.5px;padding:14px;cursor:pointer}
    #exreq-ov .exreq-btn:hover{background:#e5352f}
    #exreq-ov .exreq-msg{margin-top:10px;font-size:13px;text-align:center;min-height:16px}
    #exreq-ov .exreq-note{font-size:12px;color:#8a8f98;line-height:1.5;margin-top:10px;text-align:center}
    #exreq-ov .exreq-note b{color:var(--yellow)}
    @media(max-width:640px){#exreq-ov .exreq-g2,#exreq-ov .exreq-g3{grid-template-columns:1fr}}
    #cat-exhausts .exreq-h{font-family:'Racing Sans One',sans-serif;color:var(--yellow);font-size:18px;margin:0 0 16px;text-transform:uppercase;letter-spacing:.5px}
    #cat-exhausts .exreq-grid{display:grid;gap:14px}
    #cat-exhausts .exreq-g2{grid-template-columns:1fr 1fr}
    #cat-exhausts .exreq-g3{grid-template-columns:1fr 1fr 1fr}
    #cat-exhausts .exreq-f{display:flex;flex-direction:column;margin-bottom:8px}
    #cat-exhausts .exreq-f label{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:#bdbdbd;margin:0 0 6px}
    #cat-exhausts .exreq-hint{text-transform:none;letter-spacing:0;color:#7a7f88;font-size:10px}
    #cat-exhausts .exreq-f input,#cat-exhausts .exreq-f select,#cat-exhausts .exreq-f textarea{width:100%;background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#fff;font-family:'Oswald',sans-serif;font-size:14px;padding:10px 12px}
    #cat-exhausts .exreq-f input:focus,#cat-exhausts .exreq-f select:focus,#cat-exhausts .exreq-f textarea:focus{outline:none;border-color:var(--yellow)}
    #cat-exhausts .exreq-btn{width:100%;margin-top:8px;background:var(--red);border:none;border-radius:10px;color:#fff;font-family:'Racing Sans One',sans-serif;font-size:15px;text-transform:uppercase;letter-spacing:.5px;padding:14px;cursor:pointer;transition:.15s}
    #cat-exhausts .exreq-btn:hover{background:#e5352f;transform:translateY(-1px)}
    #cat-exhausts .exreq-msg{margin-top:10px;font-size:13px;text-align:center;min-height:16px}
    #cat-exhausts .exreq-note{margin-top:12px;font-size:12px;color:#8a8f98;line-height:1.6;text-align:center}
    #cat-exhausts .exreq-info{background:linear-gradient(180deg,rgba(242,194,48,.1),rgba(242,194,48,.02));border:1px solid rgba(242,194,48,.3);border-radius:12px;padding:14px 16px;margin:6px 0 10px;font-size:12.5px;color:#e8e2cf;line-height:1.6}
    #cat-exhausts .exreq-info b{color:var(--yellow)}
    /* barra "não achou seu carro" */
    .notfound-bar{max-width:1000px;margin:0 auto 18px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;background:linear-gradient(180deg,rgba(210,31,31,.1),rgba(255,255,255,.02));border:1px solid rgba(210,31,31,.35);border-radius:12px;padding:14px 20px}
    .notfound-bar span{color:#e7e7e7;font-size:13.5px;line-height:1.5;flex:1;min-width:240px}
    .notfound-bar button{background:var(--red);border:none;border-radius:9px;color:#fff;font-family:'Oswald',sans-serif;font-weight:600;font-size:13px;padding:11px 20px;cursor:pointer;white-space:nowrap;transition:.15s}
    .notfound-bar button:hover{background:#e5352f;transform:translateY(-1px)}
    /* modal part request */
    #partreq-ov .pr-grid{display:grid;gap:12px;margin-bottom:4px}
    #partreq-ov .pr-g2{grid-template-columns:1fr 1fr}
    #partreq-ov .pr-g3{grid-template-columns:1fr 1fr 1fr}
    #partreq-ov .pr-f{display:flex;flex-direction:column;margin-bottom:8px}
    #partreq-ov .pr-f label{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:#bdbdbd;margin:0 0 6px}
    #partreq-ov .pr-f input,#partreq-ov .pr-f select,#partreq-ov .pr-f textarea{width:100%;background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#fff;font-family:'Oswald',sans-serif;font-size:14px;padding:10px 12px}
    #partreq-ov .pr-f input:focus,#partreq-ov .pr-f select:focus,#partreq-ov .pr-f textarea:focus{outline:none;border-color:var(--yellow)}
    @media(max-width:640px){#partreq-ov .pr-g2,#partreq-ov .pr-g3{grid-template-columns:1fr}.notfound-bar{flex-direction:column;align-items:stretch}.notfound-bar button{width:100%}}
    @media(max-width:640px){#cat-exhausts .exreq-brands,#cat-exhausts .exreq-g2,#cat-exhausts .exreq-g3{grid-template-columns:1fr}#cat-exhausts .exreq-card{padding:16px}}
    #cat-exhausts .ex-anchor{cursor:pointer;font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:1.5px;font-size:12px;color:#e8e8e8;padding:10px 20px;border:1px solid rgba(242,194,48,.4);border-radius:999px;background:rgba(255,255,255,.02);transition:.15s}
    #cat-exhausts .ex-anchor:hover{background:var(--yellow);color:#0c0c0c;border-color:var(--yellow)}
    #cat-exhausts .ex-h, #cat-formulaz .ex-h{font-family:'Racing Sans One',sans-serif;color:var(--yellow);font-size:clamp(20px,2.4vw,28px);text-align:center;margin:40px auto 6px;letter-spacing:.5px}
    #cat-exhausts .ex-sub, #cat-formulaz .ex-sub{max-width:820px;margin:0 auto 22px;text-align:center;color:#9aa0aa;font-size:14px;line-height:1.6}
    #cat-exhausts .ex-grid, #cat-formulaz .ex-grid{max-width:1120px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px}
    #cat-exhausts .ex-card, #cat-formulaz .ex-card{background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:12px;padding:18px 20px}
    #cat-exhausts .ex-card-z{background:linear-gradient(135deg,rgba(210,31,31,.12),rgba(242,194,48,.08));border:1px solid var(--yellow);box-shadow:0 0 30px -10px rgba(242,194,48,.4);grid-column:1/-1}
    #cat-exhausts .ex-card-z h4{color:var(--yellow);display:flex;align-items:center;gap:10px;flex-wrap:wrap}
    #cat-exhausts .ex-flag{background:var(--red);color:#fff;font-size:10px;letter-spacing:1.5px;padding:3px 10px;border-radius:20px;font-family:'Oswald',sans-serif}
    #cat-exhausts .ex-z-cta{margin-top:12px;background:var(--yellow);color:#111;border:none;border-radius:8px;padding:10px 20px;font-family:'Oswald',sans-serif;font-weight:600;font-size:13px;letter-spacing:.5px;text-transform:uppercase;cursor:pointer;transition:.12s}
    #cat-exhausts .ex-z-cta:hover{filter:brightness(1.1)}
    #cat-exhausts .ex-card h4{margin:0 0 8px;color:#fff;font-family:'Oswald',sans-serif;font-size:16px;letter-spacing:.5px;text-transform:uppercase}
    #cat-exhausts .ex-card h4 .tag{font-size:11px;color:var(--yellow);margin-left:8px;letter-spacing:1px}
    #cat-exhausts .ex-card p{margin:0;color:#c3c7cf;font-size:14px;line-height:1.6}
    #cat-exhausts .ex-anchor.active{background:var(--yellow);color:#141414;border-color:var(--yellow)}
    #cat-exhausts .ex-tab{animation:exFade .25s ease}
    @keyframes exFade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
    #cat-exhausts .ex-tbl{max-width:1000px;margin:0 auto;border:1px solid var(--line);border-radius:12px;overflow:hidden}
    #cat-exhausts .ex-tbl table{width:100%;border-collapse:collapse;font-size:14px}
    #cat-exhausts .ex-tbl th{background:rgba(242,194,48,.10);color:var(--yellow);text-align:left;padding:12px 16px;font-family:'Oswald',sans-serif;letter-spacing:1px;text-transform:uppercase;font-size:12px}
    #cat-exhausts .ex-tbl td{padding:12px 16px;border-top:1px solid var(--line);color:#cdd1d8;vertical-align:top}
    #cat-exhausts .ex-tbl td:first-child{color:#fff;font-weight:600;white-space:nowrap}
    #cat-exhausts .ex-custom{max-width:1120px;margin:34px auto;background:linear-gradient(180deg,rgba(242,194,48,.06),rgba(255,255,255,.02));border:1px solid rgba(242,194,48,.3);border-radius:16px;padding:28px}
    #cat-exhausts .ex-custom h3{font-family:'Racing Sans One',sans-serif;color:#fff;font-size:22px;margin:0 0 6px}
    #cat-exhausts .ex-custom .lead{color:#cfcfcf;font-size:15px;line-height:1.7;margin:0 0 18px;max-width:760px}
    #cat-exhausts .ex-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-top:8px}
    #cat-exhausts .ex-step{background:rgba(0,0,0,.25);border:1px solid var(--line);border-radius:10px;padding:14px;counter-increment:exs;position:relative;color:#cdd1d8;font-size:13px;line-height:1.5}
    #cat-exhausts .ex-steps{counter-reset:exs}
    #cat-exhausts .ex-step::before{content:counter(exs);display:inline-flex;width:24px;height:24px;align-items:center;justify-content:center;background:var(--yellow);color:#0c0c0c;border-radius:7px;font-family:'Racing Sans One';font-size:13px;margin-bottom:8px}
    #cat-exhausts .ex-step b{color:#fff}
    #cat-exhausts .ex-brands{max-width:1000px;margin:14px auto 0;display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
    #cat-exhausts .ex-chip{font-family:'Oswald',sans-serif;letter-spacing:1px;text-transform:uppercase;font-size:12px;color:#aeb3bc;border:1px dashed rgba(255,255,255,.25);border-radius:999px;padding:8px 16px;background:rgba(255,255,255,.02)}
    #cat-exhausts .ex-legal{max-width:900px;margin:26px auto 0;padding:14px 18px;border-left:3px solid var(--red);background:rgba(210,31,31,.06);color:#e6c9c9;font-size:13px;line-height:1.6;border-radius:0 8px 8px 0}
  
/* bloco 17 */

    #cat-akrapovic .ak-hero{max-width:1180px;margin:20px auto 0;border-radius:16px;overflow:hidden;border:1px solid rgba(242,194,48,.3);box-shadow:0 30px 80px -30px rgba(0,0,0,.85)}
    #cat-akrapovic .ak-hero img{width:100%;height:auto;display:block}
    #cat-akrapovic .ak-brand{display:flex;gap:26px;align-items:center;margin:28px auto 6px;flex-wrap:wrap;max-width:1120px}
    #cat-akrapovic .ak-logo{flex:0 0 auto;background:#fff;border-radius:14px;padding:22px 26px;width:230px;display:flex;align-items:center;justify-content:center;box-shadow:0 14px 40px -18px #000}
    #cat-akrapovic .ak-logo img{width:100%;height:auto;display:block}
    #cat-akrapovic .ak-txt{flex:1;min-width:280px}
    #cat-akrapovic .ak-eyebrow{color:var(--yellow);font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:3px;font-size:12px;font-weight:600}
    #cat-akrapovic .ak-txt h3{font-family:'Racing Sans One',sans-serif;color:#fff;font-size:clamp(26px,3vw,38px);margin:4px 0 12px;letter-spacing:1px}
    #cat-akrapovic .ak-txt p{color:#c3c7cf;font-size:14.5px;line-height:1.7;margin:0 0 12px}
    #cat-akrapovic .ak-soon{max-width:1120px;margin:26px auto 10px;padding:26px;border:1px dashed rgba(242,194,48,.45);border-radius:16px;background:rgba(242,194,48,.05);text-align:center}
    #cat-akrapovic .ak-soon .ak-badge{display:inline-block;background:var(--yellow);color:#141414;font-family:'Racing Sans One',sans-serif;font-size:14px;padding:6px 16px;border-radius:999px;letter-spacing:1px;margin-bottom:12px}
    #cat-akrapovic .ak-soon h4{font-family:'Racing Sans One',sans-serif;color:#fff;font-size:22px;margin:0 0 8px}
    #cat-akrapovic .ak-soon p{color:#c3c7cf;font-size:14px;max-width:640px;margin:0 auto 16px;line-height:1.6}
    #cat-akrapovic .ak-cta{display:inline-block;background:var(--red);color:#fff;border:none;border-radius:10px;padding:13px 26px;font-family:'Oswald',sans-serif;font-weight:600;letter-spacing:.5px;text-transform:uppercase;cursor:pointer;font-size:13px}
    /* botão CTA profissional (Formula Z / Akrapovič) */
    .exreq-cta{display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#e5352f,var(--red));color:#fff;border:none;border-radius:12px;padding:16px 34px;font-family:'Racing Sans One',cursive;font-size:17px;letter-spacing:.5px;text-transform:uppercase;cursor:pointer;transition:.18s;box-shadow:0 12px 28px -10px rgba(210,31,31,.6)}
    .exreq-cta:hover{transform:translateY(-3px);box-shadow:0 16px 36px -10px rgba(210,31,31,.8);filter:brightness(1.08)}
    .exreq-cta:active{transform:translateY(-1px)}
  
/* bloco 18 */

    #cat-blacklist .bl-marquee{overflow:hidden;background:linear-gradient(180deg,#141414,#0a0a0a);border-top:2px solid var(--red);border-bottom:2px solid var(--red);padding:14px 0;white-space:nowrap}
    #cat-blacklist .bl-hero{position:relative;overflow:hidden;border-bottom:2px solid var(--red);
      background:radial-gradient(120% 140% at 20% 0%,#20232b 0%,#0c0d10 55%,#060607 100%);}
    #cat-blacklist .bl-hero::before{content:"";position:absolute;inset:0;opacity:.16;pointer-events:none;
      background-image:repeating-linear-gradient(115deg,rgba(255,255,255,.06) 0 2px,transparent 2px 7px),radial-gradient(60% 80% at 80% 20%,rgba(210,31,31,.18),transparent 60%);mix-blend-mode:screen}
    #cat-blacklist .bl-hero-in{position:relative;z-index:1;max-width:1180px;margin:0 auto;padding:46px 24px;display:flex;gap:30px;align-items:center;justify-content:space-between;flex-wrap:wrap}
    #cat-blacklist .bl-hero-left{flex:1;min-width:280px}
    #cat-blacklist .bl-word{font-family:'Racing Sans One',sans-serif;font-size:clamp(56px,10vw,120px);line-height:.9;color:#fff;letter-spacing:1px;transform:rotate(-3deg);
      text-shadow:0 0 6px #fff,0 0 18px rgba(255,255,255,.85),0 0 40px rgba(255,255,255,.55),0 0 80px rgba(210,31,31,.4)}
    #cat-blacklist .bl-hero-sub{margin-top:14px;font-family:'Racing Sans One',sans-serif;font-size:clamp(15px,2.2vw,24px);color:#eee;letter-spacing:2px;text-transform:uppercase;transform:rotate(-1.5deg);
      text-shadow:0 0 4px rgba(255,255,255,.8),0 0 16px rgba(255,255,255,.4)}
    #cat-blacklist .bl-wall{flex:0 0 auto;width:min(430px,100%);background:linear-gradient(180deg,rgba(10,11,13,.86),rgba(10,11,13,.72));border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:18px 22px;box-shadow:inset 0 0 60px rgba(0,0,0,.6);
      background-blend-mode:multiply}
    #cat-blacklist .bl-wall-h{font-family:'Racing Sans One',sans-serif;color:var(--red);letter-spacing:4px;font-size:14px;text-transform:uppercase;margin-bottom:10px;text-shadow:0 0 10px rgba(210,31,31,.6)}
    #cat-blacklist .bl-wall-row{display:flex;align-items:baseline;gap:10px;padding:5px 0;font-family:'Bradley Hand','Segoe Script','Comic Sans MS',cursive;color:#e8e8e8;font-size:20px;position:relative}
    #cat-blacklist .bl-wall-row .n{color:#8a8f98;width:26px;font-size:16px}
    #cat-blacklist .bl-wall-row .nm{flex:1;letter-spacing:.5px}
    #cat-blacklist .bl-wall-row .sp{color:var(--yellow);font-size:16px}
    #cat-blacklist .bl-wall-row.beat{opacity:.55}
    #cat-blacklist .bl-wall-row.beat::after{content:"";position:absolute;left:0;right:0;top:52%;height:2px;background:rgba(255,255,255,.6);transform:rotate(-1.5deg)}
    #cat-blacklist .bl-wall-row.mine .nm{color:var(--yellow)}
    #cat-blacklist .bl-mq-track{display:inline-block;white-space:nowrap;animation:blscroll 26s linear infinite;will-change:transform}
    #cat-blacklist .bl-marquee:hover .bl-mq-track{animation-play-state:paused}
    @keyframes blscroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
    #cat-blacklist .bl-mq-track span{font-family:'Racing Sans One',sans-serif;font-size:30px;letter-spacing:3px;margin:0 26px;color:#fff;text-transform:uppercase;opacity:.92}
    #cat-blacklist .bl-mq-track span.r{color:var(--red)}#cat-blacklist .bl-mq-track span.y{color:var(--yellow)}
    #cat-blacklist .bl-gate{max-width:520px;margin:40px auto;text-align:center;background:rgba(255,255,255,.03);border:1px solid rgba(242,194,48,.35);border-radius:16px;padding:40px 28px}
    #cat-blacklist .bl-gate h3{font-family:'Racing Sans One',sans-serif;color:#fff;font-size:24px;margin:0 0 10px}
    #cat-blacklist .bl-gate p{color:#c3c7cf;font-size:14px;line-height:1.6;margin:0 0 20px}
    #cat-blacklist .bl-gate button{background:var(--red);border:none;border-radius:10px;color:#fff;font-family:'Racing Sans One',sans-serif;font-size:16px;text-transform:uppercase;letter-spacing:.5px;padding:13px 30px;cursor:pointer}
    #cat-blacklist .bl-me{max-width:1120px;margin:26px auto;background:linear-gradient(180deg,rgba(242,194,48,.08),rgba(255,255,255,.02));border:1px solid rgba(242,194,48,.35);border-radius:16px;padding:24px}
    #cat-blacklist .bl-me h3{font-family:'Racing Sans One',sans-serif;color:#fff;font-size:20px;margin:0 0 4px}
    #cat-blacklist .bl-mepos{display:flex;gap:18px;flex-wrap:wrap;align-items:center;margin-bottom:16px}
    #cat-blacklist .bl-rankbadge{font-family:'Racing Sans One',sans-serif;font-size:34px;color:var(--yellow);background:rgba(0,0,0,.3);border:1px solid rgba(242,194,48,.4);border-radius:12px;padding:8px 20px}
    #cat-blacklist .bl-row{display:flex;gap:12px;flex-wrap:wrap}
    #cat-blacklist .bl-row>div{flex:1;min-width:160px}
    /* cards e grid organizados (conta E ranking) */
    #cat-blacklist .bl-card,#cat-account .bl-card{background:rgba(0,0,0,.25);border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:20px;margin-top:16px}
    #cat-blacklist .bl-card-h,#cat-account .bl-card-h{font-family:'Racing Sans One',sans-serif;color:var(--yellow);font-size:16px;margin:0 0 14px;text-transform:uppercase;letter-spacing:.5px}
    #cat-blacklist .bl-grid,#cat-account .bl-grid{display:grid;gap:14px;margin-bottom:2px}
    #cat-blacklist .bl-g2,#cat-account .bl-g2{grid-template-columns:1fr 1fr}
    #cat-blacklist .bl-g3,#cat-account .bl-g3{grid-template-columns:1fr 1fr 1fr}
    #cat-blacklist .bl-field,#cat-account .bl-field{display:flex;flex-direction:column;margin-bottom:10px}
    #cat-blacklist .bl-field[style*="display:none"],#cat-account .bl-field[style*="display:none"]{display:none !important}
    #cat-blacklist .bl-field label,#cat-account .bl-field label{margin:0 0 6px !important;display:block !important}
    #cat-account .bl-field input,#cat-account .bl-field select,#cat-account .bl-field textarea{width:100%;background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#fff;font-family:'Oswald',sans-serif;font-size:14px;padding:10px 12px}
    #cat-account .bl-field input:focus,#cat-account .bl-field select:focus{outline:none;border-color:var(--yellow)}
    #cat-blacklist .bl-hint,#cat-account .bl-hint{text-transform:none;letter-spacing:0;color:#7a7f88;font-size:10.5px}
    /* upload estilizado */
    #cat-blacklist .bl-upload,#cat-account .bl-upload{display:flex !important;align-items:center;gap:14px;background:#0c0d10;border:1.5px dashed rgba(242,194,48,.4);border-radius:12px;padding:16px 18px;cursor:pointer;transition:.15s;margin:0}
    #cat-blacklist .bl-upload:hover,#cat-account .bl-upload:hover{border-color:var(--yellow);background:rgba(242,194,48,.05)}
    #cat-blacklist .bl-upload.has-file,#cat-account .bl-upload.has-file{border-style:solid;border-color:#2ec77a;background:rgba(46,199,122,.06)}
    #cat-blacklist .bl-upload-ic,#cat-account .bl-upload-ic{flex:none}
    #cat-blacklist .bl-upload-tx b,#cat-account .bl-upload-tx b{display:block;color:#fff;font-family:'Oswald',sans-serif;font-size:14px}
    #cat-blacklist .bl-upload-tx small,#cat-account .bl-upload-tx small{color:#9aa0aa;font-size:11.5px}
    #cat-account .bl-card .bl-btn{margin-top:14px;background:var(--red);border:none;border-radius:10px;color:#fff;font-family:'Racing Sans One',sans-serif;font-size:15px;text-transform:uppercase;letter-spacing:.5px;padding:13px 26px;cursor:pointer}
    #cat-account .bl-card .bl-btn.gold{background:var(--yellow);color:#111;margin-top:0}
    @media(max-width:640px){#cat-blacklist .bl-g2,#cat-blacklist .bl-g3,#cat-account .bl-g2,#cat-account .bl-g3{grid-template-columns:1fr}#cat-blacklist .bl-card,#cat-account .bl-card{padding:14px}}
    #cat-blacklist label{display:block;font-size:11px;letter-spacing:1px;text-transform:uppercase;color:#bdbdbd;margin:10px 0 5px}
    #cat-blacklist input,#cat-blacklist select,#cat-blacklist textarea{width:100%;background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#fff;font-family:'Oswald',sans-serif;font-size:14px;padding:10px 12px}
    #cat-blacklist input:focus,#cat-blacklist select:focus,#cat-blacklist textarea:focus{outline:none;border-color:var(--yellow)}
    #cat-blacklist .bl-btn{margin-top:16px;background:var(--red);border:none;border-radius:10px;color:#fff;font-family:'Racing Sans One',sans-serif;font-size:15px;text-transform:uppercase;letter-spacing:.5px;padding:13px 26px;cursor:pointer}
    #cat-blacklist .bl-btn.gold{background:var(--yellow);color:#111}
    #cat-blacklist .bl-msg{margin-top:10px;font-size:13px;min-height:16px}
    #cat-blacklist .bl-board{max-width:1180px;margin:10px auto 0}
    #cat-blacklist .bl-h{font-family:'Racing Sans One',sans-serif;color:var(--yellow);font-size:22px;text-align:center;margin:30px 0 6px}
    #cat-blacklist .bl-sub2{text-align:center;color:#9aa0aa;font-size:13px;margin:0 0 14px}
    #cat-blacklist .bl-notice{max-width:1120px;margin:0 auto 22px;display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:linear-gradient(180deg,rgba(242,194,48,.08),rgba(255,255,255,.02));border:1px solid rgba(242,194,48,.35);border-radius:14px;padding:16px 22px}
    #cat-blacklist .bl-notice-in{color:#e7e7e7;font-size:14px;line-height:1.6;flex:1;min-width:260px}
    #cat-blacklist .bl-notice-in b{color:var(--yellow)}
    #cat-blacklist .bl-notice-btn{background:var(--red);color:#fff;border:none;border-radius:10px;padding:12px 24px;font-family:'Racing Sans One',cursive;text-transform:uppercase;letter-spacing:.5px;cursor:pointer;white-space:nowrap}
    #cat-blacklist .bl-notice-btn:hover{filter:brightness(1.08)}
    #cat-blacklist .bl-tg{cursor:pointer;font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:1.5px;font-size:13px;color:#d7dae0;padding:10px 22px;border:1px solid rgba(255,255,255,.18);border-radius:999px;background:rgba(255,255,255,.02);transition:.15s}
    #cat-blacklist .bl-tg:hover{border-color:var(--yellow)}
    #cat-blacklist .bl-tg.on{background:var(--red);color:#fff;border-color:var(--red);font-weight:600}
    #cat-blacklist .bl-tbl{width:100%;border-collapse:collapse;font-size:14px}
    #cat-blacklist .bl-tbl th{background:rgba(210,31,31,.12);color:#ff8a8a;text-align:left;padding:12px 14px;font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:1px;font-size:11px}
    #cat-blacklist .bl-tbl td{padding:11px 14px;border-top:1px solid var(--line);color:#dfe2e7;vertical-align:middle}
    #cat-blacklist .bl-tbl tr.mine td{background:rgba(242,194,48,.08)}
    #cat-blacklist .bl-tbl tr.top15 td{background:rgba(242,194,48,.05);border-top-color:rgba(242,194,48,.18)}
    #cat-blacklist .bl-tbl tr.top15.mine td{background:rgba(242,194,48,.12)}
    #cat-blacklist .bl-star{font-size:14px}
    #cat-blacklist .bl-star.top1{color:#ffd700}
    #cat-blacklist .bl-star.top2{color:#c0c0c0}
    #cat-blacklist .bl-star.top3{color:#cd7f32}
    #cat-blacklist .bl-rk{font-family:'Racing Sans One',sans-serif;color:var(--yellow);font-size:18px;width:44px}
    #cat-blacklist .bl-rk.top1{color:#ffd700}#cat-blacklist .bl-rk.top2{color:#c0c0c0}#cat-blacklist .bl-rk.top3{color:#cd7f32}
    #cat-blacklist .bl-gt{font-family:'Oswald',sans-serif;font-weight:600;color:#fff}
    #cat-blacklist .bl-sp{font-family:'Racing Sans One',sans-serif;color:var(--red);font-size:16px;white-space:nowrap}
    #cat-blacklist .bl-proof{width:56px;height:40px;object-fit:cover;border-radius:6px;border:1px solid var(--line);cursor:pointer;background:#0c0d10}
    #cat-blacklist .bl-proofbadge{font-size:10px;color:#9aa;border:1px solid var(--line);border-radius:5px;padding:3px 6px;text-transform:uppercase;letter-spacing:1px}
    #cat-blacklist .bl-mods{color:#9aa0aa;font-size:12px}
    #cat-blacklist .bl-tblwrap{overflow-x:auto;border:1px solid var(--line);border-radius:14px}
    @media(max-width:760px){#cat-blacklist .bl-hidem{display:none}}
    @media(max-width:640px){
      #cat-blacklist .bl-toggle{gap:6px;margin:6px auto 14px}
      #cat-blacklist .bl-tg{font-size:11px;padding:8px 14px;letter-spacing:1px}
      #cat-blacklist .bl-btn{font-size:13px;padding:11px 18px}
      #cat-blacklist .bl-word{font-size:clamp(40px,13vw,64px)}
      #cat-blacklist .bl-hero-in{padding:28px 16px;gap:16px}
    }
  


#blpchat-launch{position:fixed;right:20px;bottom:20px;z-index:9000;display:none;align-items:center;gap:9px;background:#25D366;color:#062e14;border:none;border-radius:30px;padding:12px 18px;font-family:'Oswald',sans-serif;font-weight:600;font-size:14px;cursor:pointer;box-shadow:0 8px 26px rgba(0,0,0,.5)}
#blpchat-launch b{background:#062e14;color:#25D366;border-radius:50%;min-width:18px;height:18px;font-size:11px;display:none;align-items:center;justify-content:center;padding:0 4px}
#blpchat{position:fixed;right:20px;bottom:20px;z-index:9001;width:min(380px,92vw);height:min(560px,80vh);display:none;flex-direction:column;background:#0e0f12;border:1px solid #23262d;border-radius:16px;overflow:hidden;box-shadow:0 18px 50px rgba(0,0,0,.6)}
#blpchat .cx-head{background:linear-gradient(180deg,#141922,#0e0f12);padding:12px 14px;display:flex;align-items:center;gap:10px;border-bottom:1px solid #23262d}
#blpchat .cx-ava{width:38px;height:38px;border-radius:50%;object-fit:cover;background:#F2C230;color:#111;display:flex;align-items:center;justify-content:center;font-weight:700;font-family:'Oswald'}
#blpchat .cx-ava img{width:100%;height:100%;border-radius:50%;object-fit:cover}
#blpchat .cx-tt{flex:1;min-width:0}
#blpchat .cx-tt .n{color:#fff;font-family:'Oswald';font-weight:600;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#blpchat .cx-tt .s{color:#8a8f98;font-size:11px}
#blpchat .cx-x{background:none;border:none;color:#8a8f98;font-size:20px;cursor:pointer}
#blpchat .cx-body{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:8px;background:#0a0b0d}
#blpchat .cx-msg{max-width:78%;padding:8px 11px;border-radius:12px;font-size:13px;line-height:1.35;word-wrap:break-word}
#blpchat .cx-msg.me{align-self:flex-end;background:#25D366;color:#06210f;border-bottom-right-radius:4px}
#blpchat .cx-msg.them{align-self:flex-start;background:#1b1e24;color:#e6e6e6;border-bottom-left-radius:4px}
#blpchat .cx-msg .ts{display:block;font-size:9px;opacity:.6;margin-top:3px}
#blpchat .cx-foot{display:flex;gap:8px;padding:10px;border-top:1px solid #23262d;background:#0e0f12}
#blpchat .cx-foot input{flex:1;background:#16181d;border:1px solid #2a2e36;border-radius:20px;padding:9px 13px;color:#fff;font-size:13px;outline:none}
#blpchat .cx-foot button{background:#F2C230;border:none;border-radius:20px;padding:0 16px;color:#111;font-weight:700;cursor:pointer}
#blpchat .cx-attach{width:38px;height:38px;flex:none;display:flex;align-items:center;justify-content:center;background:#16181d;border:1px solid #2a2e36;border-radius:50%;color:#8a8f98;font-size:22px;cursor:pointer;line-height:1}
#blpchat .cx-attach:hover{color:#F2C230;border-color:#F2C230}
#blpchat .cx-msg img{max-width:100%;border-radius:8px;margin-top:4px;display:block;cursor:pointer}
#blpchat .cx-list{flex:1;overflow-y:auto}
#blpchat .cx-thread{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid #191c22;cursor:pointer}
#blpchat .cx-modebar{display:flex;gap:6px;padding:8px 10px;background:#0e1015;border-bottom:1px solid #191c22}
#blpchat .cx-mode{flex:1;background:transparent;border:1px solid #262a33;color:#9aa0aa;border-radius:8px;padding:7px 0;font-family:'Oswald',sans-serif;font-size:12px;letter-spacing:.5px;cursor:pointer;transition:.12s}
#blpchat .cx-mode.on{background:#D21F1F;border-color:#D21F1F;color:#fff}
#blpchat .cx-thread:hover{background:#141821}
#blpchat .cx-thread .n{color:#fff;font-size:13px;font-family:'Oswald'}
#blpchat .cx-thread .p{color:#8a8f98;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px}
#blpchat .cx-thread .un{margin-left:auto;background:#D21F1F;color:#fff;border-radius:50%;min-width:18px;height:18px;font-size:10px;display:flex;align-items:center;justify-content:center}
#blpchat .cx-back{background:none;border:none;color:#F2C230;font-size:12px;cursor:pointer;padding:8px 14px;text-align:left}

/* bloco 23 */

#blplang{position:fixed;top:14px;left:50%;transform:translateX(-50%);z-index:10003}
#blplang .lg-btn{display:flex;align-items:center;gap:8px;background:rgba(0,0,0,.78);border:1px solid #2a2e36;border-radius:22px;padding:7px 14px;color:#fff;font-family:'Oswald',sans-serif;font-size:13px;letter-spacing:.5px;cursor:pointer}
#blplang .lg-btn:hover{border-color:#F2C230}
#blplang .lg-flag{font-size:17px;line-height:1}
#blplang .lg-menu{position:absolute;top:44px;left:50%;transform:translateX(-50%);background:#0e0f12;border:1px solid #23262d;border-radius:12px;padding:6px;display:none;min-width:210px;max-height:60vh;overflow:auto;box-shadow:0 18px 50px rgba(0,0,0,.6)}
#blplang.open > .lg-menu{display:block}
/* seletor de idioma sai do header: o idioma segue o pais escolhido */
#blplang > .lg-btn, #blplang > #lg-menu{display:none !important}
#blplang .lg-item{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:8px;color:#e6e6e6;font-size:13px;cursor:pointer;font-family:'Oswald',sans-serif}
#blplang .lg-item:hover{background:#171a21}
#blplang .lg-item.on{background:rgba(242,194,48,.14);color:#F2C230}
#blplang .lg-item .lg-flag{font-size:18px}
#blplang .lg-item .soon{margin-left:auto;font-size:10px;color:#666;text-transform:uppercase}

/* bloco 24 */

#blp-intro{position:fixed;inset:0;z-index:99999;background:#000;overflow:hidden;font-family:'Oswald',sans-serif}
#blp-intro.done{display:none}
/* estágio de vídeo só aparece quando é o ativo (.on), no mobile o JS pula direto pro ENTER */
#istage-video:not(.on){display:none !important}
.intro-stage{position:absolute;inset:0;display:none;align-items:center;justify-content:center;flex-direction:column}
/* ===== TELAS ENTER + IDIOMAS: imagem escurecida por dispositivo, frase, espaçamento ===== */
#istage-enter,#istage-lang{gap:26px;padding:40px 16px}
/* DESKTOP: imagem larga */
#istage-enter::before,#istage-lang::before{content:'';position:absolute;inset:0;z-index:0;
  background:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.72)),url('/assets/enter_bg_desktop.jpg?v=2') center/cover no-repeat}
/* TABLET: imagem quadrada */
@media(max-width:1024px){
  #istage-enter::before,#istage-lang::before{background:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.72)),url('/assets/enter_bg_tablet.jpg?v=2') center/cover no-repeat}
}
/* MOBILE: imagem vertical */
@media(max-width:640px){
  #istage-enter::before,#istage-lang::before{background:linear-gradient(180deg,rgba(0,0,0,.5),rgba(0,0,0,.7)),url('/assets/enter_bg_mobile.jpg?v=2') center/cover no-repeat}
}
#istage-enter>*,#istage-lang>*{position:relative;z-index:1}
/* FRASE em fonte de rua, destaque, centralizada */
.intro-tagline{font-family:'Permanent Marker',cursive;color:#fff;text-align:center;line-height:1.15;
  font-size:clamp(30px,7vw,54px);letter-spacing:1px;transform:skewX(-5deg);
  text-shadow:0 3px 0 rgba(0,0,0,.6),0 0 30px rgba(0,0,0,.5);margin-bottom:6px}
@media(max-width:640px){.intro-tagline{font-size:clamp(26px,8vw,40px)}#istage-enter,#istage-lang{gap:22px;padding:30px 14px}}
@media(min-width:1024px){.intro-tagline{font-size:56px}#istage-enter,#istage-lang{gap:30px}}
.intro-stage.on{display:flex}
/* vídeo */
#intro-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#000}
/* ===== MOBILE MENU PRINCIPAL: layout logo > vídeo > menu + hambúrguer ===== */
/* ===== PLAYER DE MÚSICA: chip só em RETRATO (celular E tablet); paisagem usa player normal ===== */
@media(max-width:1024px) and (orientation:portrait){
  #capa:not(.entered) .trax{display:none !important}
  body:not(.music-open) .trax{display:none !important}
  body.music-open #capa .trax,body.music-open .trax{display:block !important;position:fixed !important;left:50% !important;top:var(--music-top,120px) !important;right:auto !important;bottom:auto !important;transform:translateX(-50%) !important;width:min(90vw,340px) !important;max-width:340px !important;padding:15px !important;z-index:10088 !important;border-radius:16px;background:rgba(15,15,17,.98) !important;box-shadow:0 16px 40px rgba(0,0,0,.7) !important}
  body.music-open .trax .trax-bar,body.music-open .trax .bar,body.music-open .trax .trax-time,body.music-open .trax .time{display:flex !important}
  body.music-open .trax .trax-ctrls button,body.music-open .trax .cbtn{width:40px !important;height:40px !important}
  body.music-open .trax .trax-title{font-size:14px}
  body.music-open .music-chip{display:none !important}
  .music-chip{display:flex !important;position:fixed;top:auto !important;bottom:10px;left:10px;width:46px;height:46px;padding:0 !important;justify-content:center;align-items:center;border-radius:50%;z-index:10086}
  .music-chip b{display:none !important}
  .music-chip .n{font-size:22px}
}
.mob-burger,.mob-drawer,.mob-drawer-ov{display:none}
.mob-menu-panel{display:contents}/* no desktop não cria caixa (elementos fixos como sempre) */
/* vídeo vertical (1080x1350) só aparece no card do mobile vertical; desktop/horizontal usa o original */
#capaVideoVert{display:none}
/* ===== VÍDEO DE FUNDO DO MAIN MENU, POR DISPOSITIVO E ORIENTAÇÃO ===== */
#capaVideoDesk,#capaVideoTab,#capaVideoTabL,#capaVideoVert,#capaVideoVertL{display:none}
/* DESKTOP (telas grandes >1366px): */
@media(min-width:1367px){
  #capaVideo{display:none !important}
  #capaVideoDesk{display:block !important}
}
/* TABLET HORIZONTAL (paisagem, 1025-1366px, ou 900-1024 paisagem alta): */
@media(min-width:1025px) and (max-width:1366px) and (orientation:landscape),
       (min-width:900px) and (max-width:1024px) and (orientation:landscape) and (min-height:501px){
  #capaVideo{display:none !important}
  #capaVideoTabL{display:block !important}
}
/* TABLET VERTICAL (retrato, 641-1366px): */
@media(min-width:641px) and (max-width:1366px) and (orientation:portrait){
  #capaVideo{display:none !important}
  #capaVideoTab{display:block !important}
}
/* MOBILE HORIZONTAL (celular deitado, paisagem baixa): */
@media(max-height:500px) and (orientation:landscape){
  #capaVideo{display:none !important}
  #capaVideoDesk{display:none !important}#capaVideoTab{display:none !important}#capaVideoTabL{display:none !important}
  #capaVideoVertL{display:block !important;position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
}
/* MOBILE VERTICAL (celular em pé): */
@media(max-width:1024px) and (orientation:portrait){
  #capaVideo,#capaVideoDesk,#capaVideoTab{display:none !important}
  #capaVideoVert{display:block !important;position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
}
@media(max-width:1024px) and (orientation:portrait){
  /* ===== MENU MOBILE/TABLET, VÍDEO FULLSCREEN + logo topo, centro destacado, footer embaixo ===== */
  #capa:not(.entered){display:flex !important;flex-direction:column;align-items:center;justify-content:space-between;
    min-height:100vh;min-height:100dvh;padding:26px 16px 18px;background:#000;overflow:hidden;gap:0;position:relative}
  /* VÍDEO vertical preenche a tela toda (fundo) */
  #capa:not(.entered) .stage{position:absolute !important;inset:0 !important;width:100% !important;height:100% !important;margin:0 !important;overflow:hidden;background:#000;border:none !important;border-radius:0 !important;z-index:0}
  #capa:not(.entered) .scene,#capa:not(.entered) .scene-fallback{position:absolute !important;inset:0 !important;
    width:100% !important;height:100% !important;object-fit:cover !important;transform:none !important;margin:0}
  #capa:not(.entered) .scene-fallback{background-size:cover !important;background-position:center;aspect-ratio:auto}
  /* escurecimento GLOBAL bem leve (só um respiro) */
  #capa:not(.entered)::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
    background:linear-gradient(180deg,rgba(0,0,0,.28) 0%,rgba(0,0,0,.05) 22%,rgba(0,0,0,.05) 55%,rgba(0,0,0,.35) 100%)}
  #capa:not(.entered) .top-fade,#capa:not(.entered) .floor-fade,#capa:not(.entered) .capa-smoke,#capa:not(.entered) .vignette,#capa:not(.entered) .grain{display:none !important}
  /* conteúdo por cima do vídeo */
  #capa:not(.entered) .logo,#capa:not(.entered) .mm-section,#capa:not(.entered) .mm-title,#capa:not(.entered) .mob-menu-panel,#capa:not(.entered) .mm-nav,#capa:not(.entered) .mob-menu-footer{position:relative;z-index:2}
  #capa:not(.entered) .music-chip{position:fixed !important;bottom:10px;left:10px;top:auto !important;z-index:10086}
  /* LOGO no topo, maior, centralizado */
  #capa:not(.entered) .logo{position:static !important;order:1;margin:0 auto !important;width:186px !important;max-width:186px !important;min-width:186px !important;top:auto !important;left:auto !important;filter:drop-shadow(0 3px 10px rgba(0,0,0,.85));flex:none}
  /* CENTRO, painel com ESCURECIMENTO LOCALIZADO (radial) atrás dos textos/botões */
  #capa:not(.entered) .mob-menu-panel{display:flex !important;flex-direction:column;align-items:center;order:3;flex:none;
    width:100% !important;max-width:none;margin:0 auto !important;padding:36px 16px !important;background:none !important;border:none !important;border-radius:0 !important;gap:16px;position:relative}
  #capa:not(.entered) .mob-menu-panel::before{content:'';position:absolute;inset:-10% -20%;z-index:-1;pointer-events:none;
    background:radial-gradient(ellipse 70% 60% at 50% 50%,rgba(0,0,0,.78) 0%,rgba(0,0,0,.55) 45%,rgba(0,0,0,0) 78%)}
  #capa:not(.entered) .mm-section{position:static !important;margin:0 auto !important;left:auto !important;right:auto !important;bottom:auto !important;transform:skewX(-6deg) !important;text-align:center;font-size:15px !important;color:#fff !important;text-shadow:0 2px 5px #000}
  #capa:not(.entered) .mm-title{position:static !important;margin:0 auto !important;left:auto !important;right:auto !important;bottom:auto !important;text-align:center;font-size:44px !important;transform:skewX(-6deg) !important;color:#fff !important;text-shadow:0 3px 8px #000}
  #capa:not(.entered) .menu-wrap{display:none !important}
  /* ENTER + setas, CONTORNO BRANCO destacado */
  #capa:not(.entered) .mm-nav{position:static !important;margin:8px auto 0 !important;left:auto !important;right:auto !important;bottom:auto !important;transform:none !important;gap:14px}
  #capa:not(.entered) .mm-navbtn{border:2px solid #fff !important;background:rgba(0,0,0,.5) !important;backdrop-filter:blur(4px);box-shadow:0 6px 24px -6px rgba(0,0,0,.7),0 0 0 4px rgba(0,0,0,.15);color:#fff !important}
  #capa:not(.entered) .mm-navbtn.mm-enter{background:rgba(0,0,0,.6) !important;border-color:#fff !important;color:#fff !important;font-weight:600}
  #capa:not(.entered) .hint{display:none !important}
  /* FOOTER, terço de baixo, com escurecimento atrás pra destacar */
  #capa:not(.entered) .mob-menu-footer{display:flex !important;flex-direction:column;order:7;flex:none;margin-top:0 !important;padding:16px 12px 8px;position:relative;gap:8px}
  /* nomes das categorias e links EM CIMA, a frase por último (embaixo) */
  #capa:not(.entered) .mob-menu-footer .mmf-sub{order:1}
  #capa:not(.entered) .mob-menu-footer .mmf-row{order:2}
  #capa:not(.entered) .mob-menu-footer .mmf-tag{order:3;margin-top:4px}
  #capa:not(.entered) .mob-menu-footer::before{content:'';position:absolute;inset:-30% -20% -50%;z-index:-1;pointer-events:none;
    background:radial-gradient(ellipse 80% 70% at 50% 60%,rgba(0,0,0,.72) 0%,rgba(0,0,0,.4) 50%,rgba(0,0,0,0) 80%)}
  #capa:not(.entered) .mob-menu-footer .mmf-tag{color:#fff;text-shadow:0 2px 5px #000}
  #capa:not(.entered) .mob-menu-footer .mmf-sub{color:#e6e6e6;text-shadow:0 1px 4px #000}
  #capa:not(.entered) .mob-menu-footer .mmf-row a{color:var(--yellow);text-shadow:0 1px 4px #000}
  #capa:not(.entered) .mob-menu-footer .mmf-copy{color:#c3c7cf;text-shadow:0 1px 4px #000}
  #capa:not(.entered) .blp-tagband{display:none !important}
  /* header some no menu (vai pro drawer) */
  #capa:not(.entered) ~ .hdr-actions,body:has(#capa:not(.entered)) .hdr-actions{display:none !important}
  body:not(.brand-open) .hdr-actions{display:none !important}
  body.brand-open .hdr-actions{display:flex !important;top:12px !important;right:10px !important}
  #blplang{display:none !important}
  #capa:not(.entered) .music-chip{z-index:10086}
  /* botão hambúrguer, VISÍVEL no canto (borda branca, contraste) */
  .mob-burger{display:flex !important;flex-direction:column;justify-content:center;gap:5px;position:fixed;top:16px;right:14px;z-index:10090;
    width:46px;height:46px;background:#fff;border:1.5px solid rgba(0,0,0,.15);border-radius:12px;cursor:pointer;padding:0 11px;
    -webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent;
    box-shadow:0 4px 18px -4px rgba(0,0,0,.55)}
  #mobBurger span,.mob-burger span{display:block !important;height:3px !important;width:100% !important;background:#000 !important;border-radius:2px;transition:.2s;opacity:1 !important;visibility:visible !important;flex:none}
  /* estado aberto: vira um "X" preto */
  .mob-burger.on span:nth-child(1){transform:translateY(8px) rotate(45deg)}
  .mob-burger.on span:nth-child(2){opacity:0}
  .mob-burger.on span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
  .mob-drawer-ov{display:block;position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:10095;opacity:0;pointer-events:none;transition:.25s}
  .mob-drawer-ov.on{opacity:1;pointer-events:auto}
  .mob-drawer{display:flex;flex-direction:column;gap:4px;position:fixed;top:0;right:0;height:100%;width:min(74vw,280px);
    background:#0e0f12;border-left:1px solid #23262d;z-index:10096;padding:16px;transform:translateX(100%);transition:transform .28s cubic-bezier(.3,.9,.3,1);box-shadow:-16px 0 40px rgba(0,0,0,.6)}
  .mob-drawer.on{transform:translateX(0)}
  /* o menu tem de ROLAR: sem isto o que passa da altura da tela fica inalcancavel */
  .mob-drawer{width:min(88vw,340px) !important;height:100vh;height:100dvh;
    overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
    padding-bottom:calc(28px + env(safe-area-inset-bottom)) !important;scrollbar-width:thin}
  .mob-drawer::-webkit-scrollbar{width:5px}
  .mob-drawer::-webkit-scrollbar-thumb{background:rgba(255,255,255,.16);border-radius:3px}
  .mob-drawer-h{position:sticky;top:-16px;background:#0e0f12;z-index:2;padding-top:4px;margin:-4px 0 12px}
  /* tres blocos: idioma, moeda, pais, um abrindo por vez */
  .mob-grp-dica{color:#8a8f98;font-size:11.5px;line-height:1.45;margin:14px 0 10px}
  .mob-grp{border:1px solid var(--line);border-radius:12px;margin-bottom:8px;overflow:hidden;background:rgba(255,255,255,.02)}
  .mob-grp-h{display:flex;align-items:center;gap:9px;width:100%;background:none;border:0;padding:13px 13px;cursor:pointer;text-align:left}
  .mob-grp-l{color:#8a8f98;font:500 10.5px Oswald,sans-serif;letter-spacing:1.1px;text-transform:uppercase;flex:none}
  .mob-grp-v{color:#fff;font:500 13.5px Oswald,sans-serif;margin-left:auto;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:56%}
  .mob-grp-a{color:#8a8f98;font-size:19px;line-height:1;flex:none;transition:transform .2s}
  .mob-grp.on{border-color:rgba(242,194,48,.5)}
  .mob-grp.on .mob-grp-a{transform:rotate(90deg);color:var(--yellow)}
  .mob-grp-b{display:none;padding:0 10px 11px;flex-wrap:wrap;gap:6px}
  .mob-grp.on .mob-grp-b{display:flex}
  .mob-grp-b>button{display:flex;align-items:center;gap:7px;width:100%;background:rgba(255,255,255,.03);
    border:1px solid var(--line);border-radius:10px;padding:11px 12px;color:#fff;font:400 13.5px Oswald,sans-serif;cursor:pointer;text-align:left}
  .mob-grp-b>button.on{background:var(--yellow);color:#111;border-color:var(--yellow);font-weight:600}
  .mob-grp-b>button i{font-style:normal;opacity:.55;margin-left:auto;font-size:12px;flex:none}
  .mob-grp-b>button span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .mob-grp-b .mob-drawer-cur{display:grid;grid-template-columns:repeat(auto-fill,minmax(66px,1fr));gap:6px;width:100%}
  .mob-grp-b .mob-drawer-cur button{display:block;width:100%;text-align:center;background:rgba(255,255,255,.03);
    border:1px solid var(--line);border-radius:10px;padding:11px 4px;color:#fff;font:500 12.5px Oswald,sans-serif;letter-spacing:.4px;cursor:pointer}
  .mob-grp-b .mob-drawer-cur button.on{background:var(--yellow);color:#111;border-color:var(--yellow);font-weight:700}
  .mob-drawer-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
  .mob-drawer-h b{font-family:'Oswald',sans-serif;font-size:18px;color:#fff}.mob-drawer-h b span{color:var(--yellow)}
  .mob-drawer-x{background:none;border:none;color:#9aa0aa;font-size:26px;cursor:pointer;line-height:1}
  .mob-drawer-item{display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:11px;
    padding:13px 14px;color:#fff;font-family:'Oswald',sans-serif;font-size:15px;cursor:pointer;text-align:left;width:100%}
  .mob-drawer-item:hover{background:rgba(242,194,48,.1);border-color:var(--yellow)}
  .mob-drawer-item svg{width:20px;height:20px;flex:none}
  .mob-drawer-badge{margin-left:auto;background:var(--red);color:#fff;border-radius:10px;padding:1px 8px;font-size:12px}
  .mob-drawer-lbl{color:#9aa0aa;font-size:11px;text-transform:uppercase;letter-spacing:1px;margin:14px 0 6px}
  .mob-drawer-langs{display:flex;flex-wrap:wrap;gap:6px}
  .mob-drawer-langs button{display:flex;align-items:center;gap:6px;background:rgba(255,255,255,.03);border:1px solid var(--line);border-radius:20px;padding:7px 12px;color:#fff;font-size:13px;cursor:pointer;font-family:'Oswald',sans-serif}
  .mob-drawer-langs button.on{background:var(--yellow);color:#111;border-color:var(--yellow)}
  body.brand-open .mob-burger,body.brand-open .mob-drawer,body.brand-open .mob-drawer-ov{display:none !important}
}
/* ===== FOOTER do menu mobile (preenche o preto), retrato e paisagem ===== */
.mob-menu-footer{display:none;flex-direction:column;align-items:center;gap:10px;width:100%;margin-top:auto;padding:22px 18px calc(18px + env(safe-area-inset-bottom));
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.6)40%,#000);text-align:center}
.mob-menu-footer .mmf-tag{font-family:'Permanent Marker',cursive;color:#fff;font-size:16px;letter-spacing:.5px;transform:skewX(-5deg);opacity:.92;text-shadow:2px 2px 0 rgba(0,0,0,.5);line-height:1.3}
.mob-menu-footer .mmf-sub{color:#9aa0aa;font-family:'Oswald',sans-serif;font-size:11px;text-transform:uppercase;letter-spacing:2px}
.mob-menu-footer .mmf-row{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:2px}
.mob-menu-footer .mmf-row a{color:var(--yellow);font-family:'Oswald',sans-serif;font-size:12px;text-decoration:none;border-bottom:1px dotted rgba(242,194,48,.5);cursor:pointer}
.mob-menu-footer .mmf-copy{color:#5a5f66;font-family:'Oswald',sans-serif;font-size:10px;letter-spacing:1px;margin-top:4px}
@media(max-width:900px){
  /* mobile/tablet paisagem: vídeo completo (contain) */
  #intro-vid{object-fit:contain !important;background:#000}
  #blp-intro .intro-vidctrl{bottom:14px;width:94vw}
  #blp-intro .iv-skip,#blp-intro .skip-intro{font-size:12px !important;padding:8px 16px !important}
}
@media(max-width:640px) and (orientation:portrait){
  /* RETRATO: adapta, vídeo no tamanho certo, centrado, com a marca em volta */
  #istage-video{display:flex !important;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(ellipse at center,#141416 0%,#000 75%) !important;padding:0}
  #intro-vid{position:static !important;inset:auto !important;width:100vw !important;height:auto !important;max-height:56vh;object-fit:contain !important;background:#000}
  /* logo em cima do vídeo */
  #istage-video::before{content:'';display:block;width:min(72vw,300px);height:84px;margin-bottom:20px;
    background:url('/assets/logo.webp') center/contain no-repeat;filter:drop-shadow(0 4px 14px rgba(0,0,0,.6))}
  /* tagline embaixo */
  #istage-video::after{content:'ONLY THE BUILT MAKE THE LIST';display:block;margin-top:18px;
    font-family:'Permanent Marker',cursive;color:#fff;font-size:15px;letter-spacing:1px;
    text-align:center;opacity:.85;transform:skewX(-5deg);text-shadow:2px 2px 0 rgba(0,0,0,.5)}
  /* botão SKIP e controles reposicionados pra não cobrir */
  #blp-intro .intro-skip{top:auto;bottom:18px;right:50%;transform:translateX(50%)}
  #blp-intro .intro-vidctrl{bottom:56px}
  #blp-intro .intro-rotate{display:none !important}
}
.intro-sound{position:absolute;top:22px;right:150px;z-index:5;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.35);color:#fff;padding:11px 18px;border-radius:26px;font-size:14px;letter-spacing:.5px;cursor:pointer;font-family:inherit;backdrop-filter:blur(4px)}
.intro-sound.on{background:var(--gold,#F2C230);color:#111;border-color:var(--gold,#F2C230)}
.intro-skip{position:absolute;top:22px;right:22px;z-index:5;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.35);color:#fff;
  padding:11px 20px;border-radius:26px;font-size:15px;letter-spacing:1px;cursor:pointer;font-family:inherit;backdrop-filter:blur(4px);transition:.2s}
.intro-skip:hover{background:var(--red,#D21F1F);border-color:var(--red,#D21F1F)}
.intro-skip .arw{opacity:.8}
.intro-vidctrl{position:absolute;left:50%;bottom:26px;transform:translateX(-50%) translateY(10px);z-index:6;display:flex;flex-direction:column;gap:8px;width:min(680px,92vw);
  background:rgba(0,0,0,.6);border:1px solid rgba(255,255,255,.25);border-radius:16px;padding:12px 16px;backdrop-filter:blur(6px);
  opacity:0;pointer-events:none;transition:.25s}
.intro-vidctrl .ivc-bar{height:7px;background:rgba(255,255,255,.2);border-radius:6px;cursor:pointer;overflow:hidden}
.intro-vidctrl .ivc-bar .ivc-fill{height:100%;width:0;background:var(--gold,#F2C230);border-radius:6px}
.intro-vidctrl .ivc-row{display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap}
.intro-vidctrl .ivc-time{color:#ccc;font-size:12px;margin-right:4px;min-width:88px}
#istage-video:hover .intro-vidctrl,.intro-vidctrl.show{opacity:1;pointer-events:auto;transform:translateX(-50%) translateY(0)}
/* telas de toque não têm :hover, então os controles do vídeo ficam sempre visíveis e clicáveis */
@media(pointer:coarse){
  #blp-intro .intro-vidctrl{opacity:1 !important;pointer-events:auto !important;transform:translateX(-50%) translateY(0) !important}
  #blp-intro .intro-vidctrl button{padding:11px 15px}
}
/* no toque o video de intro e sempre pulado -> esconde o elemento (Safari renderiza video vazio como quadro branco) e os controles inuteis */
@media(pointer:coarse){
  #blp-intro #intro-vid{display:none !important}
  #blp-intro .intro-vidctrl{display:none !important}
}
.intro-vidctrl button{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.25);color:#fff;border-radius:20px;
  padding:9px 14px;font-family:inherit;font-size:13px;letter-spacing:.5px;cursor:pointer;transition:.15s;white-space:nowrap}
.intro-vidctrl button:hover{background:var(--gold,#F2C230);color:#111;border-color:var(--gold,#F2C230)}
.intro-vidctrl .ivc-skip{background:var(--red,#D21F1F);border-color:var(--red,#D21F1F);font-weight:600}
.intro-vidctrl .ivc-skip:hover{background:#b91a1a}
/* aviso girar tela */
.intro-rotate{position:absolute;inset:0;z-index:6;display:none;flex-direction:column;align-items:center;justify-content:center;
  background:rgba(0,0,0,.86);color:#fff;text-align:center;gap:18px;padding:30px}
.intro-rotate .rot-ic{width:78px;height:78px;animation:rotwig 1.6s ease-in-out infinite}
.intro-rotate .rot-tt{font-size:20px;letter-spacing:1px}
.intro-rotate .rot-sub{font-size:13px;color:#bbb;max-width:260px;line-height:1.5}
@keyframes rotwig{0%,100%{transform:rotate(-12deg)}50%{transform:rotate(78deg)}}
/* tela preta + ENTER piscando */
.intro-enter-btn{background:var(--gold,#F2C230);border:2px solid var(--gold,#F2C230);color:#111;
  padding:20px 60px;font-size:30px;letter-spacing:6px;border-radius:10px;cursor:pointer;font-family:'Racing Sans One',sans-serif;
  transition:.2s;box-shadow:0 10px 34px -8px rgba(242,194,48,.55)}
.intro-enter-btn:hover{filter:brightness(1.08);transform:translateY(-2px)}
@media(max-width:640px){.intro-enter-btn{padding:16px 44px;font-size:24px;letter-spacing:4px}}
@keyframes blink{0%,100%{opacity:1;box-shadow:0 0 24px rgba(242,194,48,.5)}50%{opacity:.35;box-shadow:0 0 0 rgba(242,194,48,0)}}
.intro-hint{position:relative;bottom:auto;margin-top:6px;color:#9aa0aa;font-size:12px;letter-spacing:3px;text-align:center}
/* seleção de idioma */
.intro-lang-title{color:#fff;font-size:26px;letter-spacing:2px;margin-bottom:26px;font-family:'Racing Sans One',sans-serif;text-align:center;padding:0 12px;max-width:100vw}
@media(max-width:600px){.intro-lang-title{font-size:19px;letter-spacing:1px;margin-bottom:18px}}
.intro-stage{padding-left:8px;padding-right:8px;box-sizing:border-box}
/* carrossel de idioma com moldura (estilo menu do jogo) */
.lang-frame{position:relative;display:flex;align-items:center;gap:10px;max-width:min(860px,94vw);width:100%;
  border:2px solid rgba(242,194,48,.55);border-radius:16px;padding:14px 8px;background:rgba(0,0,0,.4);
  box-shadow:0 0 40px rgba(242,194,48,.12),inset 0 0 30px rgba(0,0,0,.5)}
.lang-frame::before,.lang-frame::after{content:"";position:absolute;width:16px;height:16px;border:2px solid var(--gold,#F2C230)}
.lang-frame::before{top:-2px;left:-2px;border-right:none;border-bottom:none}
.lang-frame::after{bottom:-2px;right:-2px;border-left:none;border-top:none}
.lang-carousel{overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;flex:1;cursor:grab;scrollbar-width:none;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.lang-carousel::-webkit-scrollbar{display:none}
.lang-carousel.drag{cursor:grabbing}
.lang-track{display:flex;gap:12px;width:max-content;padding:4px}
.lang-card{flex:none;width:150px;display:flex;flex-direction:column;align-items:center;gap:8px;
  background:#111318;border:1px solid #2a2e36;border-radius:12px;padding:16px 10px;color:#e6e6e6;cursor:pointer;transition:.18s;user-select:none}
.lang-card:hover{border-color:var(--gold,#F2C230);background:#171a21;transform:translateY(-2px)}
.lang-card.sel{border-color:var(--gold,#F2C230);background:rgba(242,194,48,.12);box-shadow:0 0 0 2px rgba(242,194,48,.5),0 8px 24px rgba(0,0,0,.5);transform:translateY(-3px)}
.lang-card.sel{border-color:var(--gold,#F2C230);background:rgba(242,194,48,.14);box-shadow:0 0 18px rgba(242,194,48,.3)}
.lang-card .fl{font-size:30px;line-height:1}
.lang-card .nm{font-size:14px;font-family:'Oswald'}
.lang-arrow{flex:none;background:rgba(0,0,0,.5);border:1px solid rgba(255,255,255,.25);color:#fff;width:42px;height:42px;
  border-radius:50%;font-size:22px;cursor:pointer;transition:.2s}
.lang-arrow:hover{background:var(--gold,#F2C230);color:#111;border-color:var(--gold,#F2C230)}
@media(max-width:500px){.lang-card{width:120px}.lang-arrow{width:36px;height:36px}}
@media (max-width:900px){ .intro-rotate,#istage-video .intro-rotate,#istage-enter .intro-rotate{display:none !important} }

/* bloco 25 */

#wheels-app{max-width:1150px;margin:20px auto 0}
.wh-vehbar{background:#0f1115;border:1px solid #23262d;border-radius:12px;padding:14px 18px;margin-bottom:16px}
.wh-vehempty{display:flex;align-items:center;gap:12px;flex-wrap:wrap;color:#c9ccd2}
.wh-vehfilled{display:flex;gap:18px;flex-wrap:wrap;align-items:center;color:#e8e8ea;font-size:14px}
.wh-vehfilled b{color:#F2C230}
.wh-btn{border:none;border-radius:22px;padding:9px 16px;cursor:pointer;font-family:Oswald,sans-serif;font-size:13px}
.wh-btn.gold{background:#F2C230;color:#111;font-weight:600}
.wh-btn.ghost{background:#1b1e24;color:#fff;border:1px solid #2a2e36}
.wh-btn.red{background:#D21F1F;color:#fff;font-weight:600}
.wh-btn.big{width:100%;padding:13px;margin-top:14px;font-size:15px}
.wh-btn:disabled{opacity:.4;cursor:not-allowed}
.wh-steps{display:flex;gap:10px;justify-content:center;color:#8a8f98;font-size:13px;margin:6px 0 18px;flex-wrap:wrap}
.wh-collections{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px}
.wh-col{background:#111318;border:1px solid #23262d;border-radius:14px;padding:22px;cursor:pointer;transition:.18s}
.wh-col:hover{border-color:#F2C230;transform:translateY(-2px)}
.wh-col h4{margin:0 0 6px;font-family:'Racing Sans One';color:#F2C230;font-size:20px}
.wh-col p{margin:0;color:#9aa0a8;font-size:13px}
.wh-designgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.wh-design{background:#111318;border:1px solid #23262d;border-radius:14px;overflow:hidden;cursor:pointer;transition:.18s}
.wh-design:hover{border-color:#F2C230;transform:translateY(-3px)}
.wh-design .wd-top{aspect-ratio:16/10;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 40%,#22262e,#0c0d10)}
.wh-design .wd-top svg{width:120px;height:120px}
.wh-design .wd-body{padding:14px}
.wh-design .wd-con{font-size:10px;letter-spacing:1px;color:#8A6EF2;text-transform:uppercase}
.wh-design .wd-name{font-size:16px;font-weight:600;margin:3px 0}
.wh-design .wd-spec{font-size:12px;color:#8a8f98}
.wh-design .wd-mto{display:inline-block;margin-top:8px;font-size:11px;color:#F2C230;border:1px solid rgba(242,194,48,.4);border-radius:20px;padding:2px 10px}
#wh-modal,#wh-garage,#wh-guide{position:fixed;inset:0;z-index:10080;background:rgba(0,0,0,.9);display:none;align-items:flex-start;justify-content:center;padding:30px 16px;overflow-y:auto;overflow-x:hidden}
#wh-modal *,#wh-garage *,#wh-guide *{box-sizing:border-box}
.wh-modal-inner{background:#0f1115;border:1px solid #2a2e36;border-radius:16px;max-width:920px;width:100%;padding:26px;position:relative;box-sizing:border-box;overflow-x:hidden}
#wh-modal.on,#wh-garage.on,#wh-guide.on{display:flex}
.wh-modal-inner.sm{max-width:460px}
.wh-x{position:absolute;top:14px;right:16px;background:none;border:none;color:#fff;font-size:28px;cursor:pointer}
.wh-form{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;align-items:center;margin-top:12px}
.wh-form label{font-size:12px;color:#9aa0a8}
.wh-form input,.wh-form select{background:#16181d;border:1px solid #2a2e36;border-radius:8px;padding:9px;color:#fff;font-size:13px;font-family:inherit}
.wh-hint{color:#8a8f98;font-size:12px;margin:4px 0 0}
.wh-cfg{display:grid;grid-template-columns:1.1fr 1fr;gap:22px}
@media(max-width:760px){.wh-cfg{grid-template-columns:1fr}.wh-collections{grid-template-columns:1fr}.wh-form{grid-template-columns:1fr}}
/* MOBILE: força TODO o configurador de rodas a caber na tela (nada estoura pro lado) */
@media(max-width:640px){
  #wh-modal,#wh-garage,#wh-guide{padding:16px 10px !important}
  #wh-modal .wh-modal-inner{padding:16px !important;max-width:100% !important;width:100% !important;overflow-x:hidden !important}
  #wh-build{max-width:100% !important;overflow-x:hidden !important}
  #wh-build *{min-width:0 !important;max-width:100% !important}
  #wh-build .wh-cfg{grid-template-columns:1fr !important;gap:14px !important}
  #wh-build svg,#wh-build img,#wh-build canvas{width:100% !important;max-width:100% !important;height:auto !important}
  #wh-build .wp-stage{width:100% !important;aspect-ratio:16/10}
  #wh-build select,#wh-build input,#wh-build textarea{width:100% !important;box-sizing:border-box !important;font-size:14px}
  #wh-build .wh-row{margin:9px 0 !important}
  #wh-build h3{font-size:18px !important}
  #wh-build .wh-verdict{font-size:12.5px !important;padding:10px 12px !important}
  #wh-build .wp-cars img,#wh-build .wp-colors>*{width:auto !important}
}
.wh-cfg h3{font-family:'Racing Sans One';color:#fff;margin:0 0 2px}
.wh-cfg .wd-con{font-size:11px;color:#8A6EF2;letter-spacing:1px;text-transform:uppercase}
.wh-row{margin:12px 0}
.wh-row label{display:block;font-size:12px;color:#9aa0a8;margin-bottom:5px}
.wh-row select,.wh-row input{width:100%;background:#16181d;border:1px solid #2a2e36;border-radius:8px;padding:9px;color:#fff;font-family:inherit}
.wh-verdict{border-radius:12px;padding:16px;margin-bottom:14px;border:1px solid}
.wh-verdict.easy{background:rgba(74,222,128,.1);border-color:#4ade80;color:#8ff0b0}
.wh-verdict.parts{background:rgba(242,194,48,.1);border-color:#F2C230;color:#f0d98a}
.wh-verdict.aggr{background:rgba(255,140,0,.12);border-color:#ff8c00;color:#ffb968}
.wh-verdict.fail{background:rgba(210,31,31,.14);border-color:#D21F1F;color:#ff8080}
.wh-verdict .vtitle{font-family:'Racing Sans One';font-size:18px;margin-bottom:6px}
.wh-verdict ul{margin:6px 0 0;padding-left:18px;font-size:12.5px}
.wh-hardware{background:#111318;border:1px solid #23262d;border-radius:12px;padding:14px;margin-bottom:12px}
.wh-hardware h4{margin:0 0 8px;font-size:13px;color:#F2C230;text-transform:uppercase;letter-spacing:1px}
.wh-hw{display:flex;gap:9px;align-items:flex-start;padding:8px 0;border-bottom:1px solid #1c1f25}
.wh-hw:last-child{border:none}
.wh-hw input{margin-top:3px}
.wh-hw .hw-t{font-size:13px;color:#e8e8ea}
.wh-hw .hw-why{font-size:11px;color:#8a8f98}
.wh-hw .hw-req{font-size:10px;color:#D21F1F;font-weight:600}
.wh-ack{display:flex;gap:8px;align-items:flex-start;background:rgba(255,140,0,.1);border:1px solid #ff8c00;border-radius:8px;padding:10px;margin-bottom:10px;font-size:12px;color:#ffb968}
.wh-guide-h{font-family:'Racing Sans One';color:#F2C230;font-size:22px;margin:0 0 10px}
#wh-guide-body h4{color:#F2C230;margin:16px 0 4px}
#wh-guide-body p{color:#c9ccd2;font-size:13.5px;line-height:1.6;margin:4px 0}

/* bloco 26 */

#cat-games .games-grid{max-width:1000px;margin:22px auto 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}
@media(max-width:640px){
  #cat-games .games-grid{grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
  .game-card{border-radius:11px}
  .game-card .gc-body{padding:10px}
  .game-card .gc-price{font-size:16px}
  .game-card .gc-combo-in{font-size:24px}
  .game-card .gc-title,.game-card .gc-name{font-size:13px;line-height:1.25}
  .game-card .gc-add{font-size:11px;padding:8px 8px}
  .game-card .gc-foot{flex-wrap:wrap;gap:6px}
}
.game-card{display:grid;grid-template-columns:1fr;background:#111318;border:1px solid #23262d;border-radius:14px;overflow:hidden}
.game-card .gc-media{aspect-ratio:16/9;background:#0c0d10;display:flex;align-items:center;justify-content:center;overflow:hidden}
.game-card .gc-media img{width:100%;height:100%;object-fit:contain;background:#0a0a0a}
.game-card .gc-media{position:relative;aspect-ratio:1/1;background:#0a0a0a}
.game-card{cursor:pointer}
.game-card.combo .gc-combo{display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#2a0a0a,#3a1414)}
.game-card.combo .gc-combo-in{font-family:'Racing Sans One',cursive;color:#fff;font-size:38px;text-align:center;line-height:1;text-shadow:0 0 18px rgba(210,31,31,.7)}
#game-ov .gd-wrap{display:flex;gap:22px;flex-wrap:wrap}
#game-ov .gd-cover{flex:0 0 auto;width:260px;max-width:100%;background:#0a0a0a;border-radius:12px;overflow:hidden;border:1px solid var(--line)}
#game-ov .gd-cover img{width:100%;height:auto;display:block;object-fit:contain}
#game-ov .gd-info{flex:1;min-width:260px}
#game-ov .gd-eyebrow{color:var(--red);font-family:'Oswald',sans-serif;text-transform:uppercase;letter-spacing:2px;font-size:11px;font-weight:600}
#game-ov .gd-info h3{font-family:'Racing Sans One',cursive;color:#fff;font-size:26px;margin:4px 0 2px}
#game-ov .gd-year{color:#9aa0aa;font-size:13px;margin-bottom:12px}
#game-ov .gd-info p{color:#c3c7cf;font-size:14.5px;line-height:1.7}
#game-ov .gd-buy{display:flex;align-items:center;gap:16px;margin-top:16px}
#game-ov .gd-price{font-family:'Racing Sans One',cursive;color:var(--yellow);font-size:24px}
#game-ov .gd-note{margin-top:14px;font-size:12px;color:#8a8f98;line-height:1.6;border-top:1px solid var(--line);padding-top:12px}
.game-card .gc-body{padding:16px}
.game-card .gc-name{font-family:'Racing Sans One';font-size:19px;color:#fff}
.game-card .gc-year{color:#8a8f98;font-size:13px;margin:2px 0 8px}
.game-card .gc-desc{color:#c9ccd2;font-size:13px;line-height:1.5}
.game-card .gc-foot{display:flex;align-items:center;justify-content:space-between;margin-top:14px;gap:10px}
.game-card .gc-price{font-family:'Racing Sans One';font-size:22px;color:#F2C230}
.game-card .gc-add{background:#D21F1F;border:none;color:#fff;border-radius:22px;padding:10px 18px;cursor:pointer;font-family:Oswald;font-weight:600}
#cat-games{padding-bottom:60px}
#cat-games .games-note{max-width:1000px;margin:18px auto 0;background:rgba(242,194,48,.1);border:1px solid rgba(242,194,48,.4);color:#f0d98a;border-radius:10px;padding:11px 16px;font-size:13px;text-align:center}
/* seleção de brinde no checkout */
#gift-block{margin:16px 0;padding:14px;border:1px dashed rgba(242,194,48,.5);border-radius:12px;background:rgba(242,194,48,.06)}
#gift-block h4{margin:0 0 4px;color:#F2C230;font-size:14px}
#gift-block .gift-opt{display:flex;align-items:center;gap:9px;padding:8px 0;color:#e8e8ea;font-size:14px;cursor:pointer}
#gift-block .gift-hint{font-size:12px;color:#8a8f98}

/* bloco 27 */

#wp-wrap{margin-top:18px;border-top:1px solid #23262d;padding-top:16px}
#wp-wrap .wp-head{font-family:'Racing Sans One';color:#F2C230;font-size:16px;margin-bottom:12px}
#wp-wrap .wp-row-lbl{font-size:11px;letter-spacing:1px;color:#8a8f98;text-transform:uppercase;margin:0 0 6px}
#wp-wrap .wp-cars,#wp-wrap .wp-colors{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
#wp-wrap .wp-modelphoto{text-align:center}
#wp-wrap .wp-modelphoto img{max-width:100%;max-height:520px;object-fit:contain;border-radius:12px}
#wp-wrap .wp-mp-cap{color:#9aa0aa;font-size:12.5px;margin-top:10px;font-family:Oswald}
#wp-wrap .wp-cars button{background:#16181d;border:1px solid #2a2e36;border-radius:22px;padding:8px 15px;color:#c9ccd2;cursor:pointer;font-family:Oswald;font-size:13px;transition:.15s}
#wp-wrap .wp-cars button:hover{border-color:#F2C230}
#wp-wrap .wp-cars button.on{background:#F2C230;color:#111;font-weight:600;border-color:#F2C230}
#wp-wrap .wp-colors button{display:flex;align-items:center;gap:7px;background:#16181d;border:1px solid #2a2e36;border-radius:22px;padding:6px 13px 6px 8px;color:#c9ccd2;cursor:pointer;font-family:Oswald;font-size:12.5px;transition:.15s}
#wp-wrap .wp-colors button:hover{border-color:#F2C230}
#wp-wrap .wp-colors button.on{border-color:#F2C230;color:#fff}
#wp-wrap .wp-colors .sw{width:15px;height:15px;border-radius:50%;border:1px solid rgba(255,255,255,.3);flex:none}
#wp-wrap .wp-stage{position:relative;width:100%;aspect-ratio:3/2;background:#000;border:1px solid #23262d;border-radius:12px;overflow:hidden;display:flex;align-items:center;justify-content:center}
#wp-wrap .wp-stage img{width:100%;height:100%;object-fit:contain}
#wp-wrap .wp-hint2{color:#8a8f98;font-size:13px;padding:24px;text-align:center}

/* bloco 28 */

/* ===== Cartoes novos do admin (paises, frete, firebase, analytics): mesmo visual do site ===== */
#cat-admin .adm-card .blp-sub{color:#8a8f98;font-weight:400;font-size:12px;letter-spacing:.2px}
#cat-admin .adm-card .blp-hint{color:#9aa0aa;font-size:12.5px;line-height:1.5;margin:8px 0 14px}
#cat-admin .adm-card .blp-warn{margin-top:12px;border:1px solid rgba(242,194,48,.45);background:rgba(242,194,48,.07);color:#F2C230;border-radius:10px;padding:10px 12px;font-size:12.5px}
#cat-admin .adm-card .blp-msg{font-size:12.5px;color:#7fe0a8}
/* campos */
#cat-admin .adm-card input:not([type=checkbox]):not([type=radio]),
#cat-admin .adm-card select,
#cat-admin .adm-card textarea,
#cat-admin .adm-card .blp-in{
  background:#0c0d10;border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#fff;
  font-family:'Oswald',sans-serif;font-size:14px;padding:10px 12px;box-sizing:border-box;outline:none;transition:border-color .15s}
#cat-admin .adm-card input:focus,#cat-admin .adm-card select:focus,#cat-admin .adm-card textarea:focus{border-color:rgba(242,194,48,.75)}
#cat-admin .adm-card .blp-in.sm{width:64px;padding:7px 9px;text-align:right}
#cat-admin .adm-card label.set-lbl,#cat-admin .adm-card .set-lbl{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.6px;color:#9aa0aa;margin:0 0 5px;font-family:'Oswald',sans-serif}
#cat-admin .adm-card select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,#8a8f98 50%),linear-gradient(135deg,#8a8f98 50%,transparent 50%);
  background-position:calc(100% - 15px) 18px,calc(100% - 10px) 18px;background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:30px}
/* botoes */
#cat-admin .adm-card .blp-btn,#cat-admin .adm-card .pja-add{background:#F2C230;border:0;border-radius:9px;color:#111;font-family:'Oswald',sans-serif;font-weight:600;font-size:13.5px;
  letter-spacing:.5px;padding:11px 18px;cursor:pointer;transition:filter .15s;margin:0}
#cat-admin .adm-card .blp-btn:hover,#cat-admin .adm-card .pja-add:hover{filter:brightness(1.08)}
#cat-admin .adm-card .blp-btn.ghost,#cat-admin .adm-card .pja-hide{background:transparent;color:#e6e8eb;border:1px solid rgba(255,255,255,.2);border-radius:9px;
  font-family:'Oswald',sans-serif;font-size:13.5px;padding:11px 16px;cursor:pointer}
#cat-admin .adm-card .blp-btn.ghost:hover,#cat-admin .adm-card .pja-hide:hover{border-color:rgba(242,194,48,.6);color:#F2C230}
#cat-admin .adm-card .blp-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:14px}
/* grupos de regiao */
#cat-admin .blp-reg{margin:16px 0 4px}
#cat-admin .blp-reg-h{font:500 12px Oswald,sans-serif;letter-spacing:1.3px;text-transform:uppercase;color:#F2C230;
  display:flex;align-items:center;gap:10px;padding-bottom:6px;border-bottom:1px solid rgba(242,194,48,.22)}
#cat-admin .blp-reg-h span{color:#7d828b;letter-spacing:.5px;text-transform:none;font-size:11.5px}
#cat-admin .blp-reg-d{color:#8a8f98;font-size:12px;line-height:1.45;margin:7px 0 10px}
/* grade de paises */
#cat-admin .blp-mkts{display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:9px}
#cat-admin .blp-mkt{border:1px solid rgba(255,255,255,.09);border-radius:11px;background:#121419;padding:10px 12px}
#cat-admin .blp-mkt.out{border-color:rgba(242,194,48,.35);background:rgba(242,194,48,.05)}
#cat-admin .blp-mkt-h{display:flex;align-items:center;gap:8px;color:#e6e8eb;text-decoration:none;font-family:'Oswald',sans-serif}
#cat-admin .blp-mkt-h:hover b{color:#F2C230}
#cat-admin .blp-mkt-h .fl{font-size:17px;line-height:1}
#cat-admin .blp-mkt-h b{color:#fff;font-weight:500;font-size:13.5px}
#cat-admin .blp-mkt-h .nm{flex:1;min-width:0;color:#9aa0aa;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#cat-admin .blp-mkt-h .cur{color:#F2C230;font-size:12px;letter-spacing:.5px}
#cat-admin .blp-mkt-m{display:flex;align-items:center;gap:7px;margin-top:9px;color:#c9ced6;font-size:12.5px;font-family:'Oswald',sans-serif}
#cat-admin .blp-mkt-m.off{color:#6f747c;font-size:12px;margin-top:9px}
/* tabela e detalhes (frete) */
#cat-admin .adm-card details{border:1px solid rgba(255,255,255,.09);border-radius:11px;background:#121419;padding:11px 13px}
#cat-admin .adm-card details summary{outline:none}
#cat-admin .adm-card .hint{color:#9aa0aa;font-size:12.5px;line-height:1.5}

/* bloco 29 */

/* =====================================================================
   ACABAMENTO GERAL: botoes, campos e desempenho em celular/tablet.
   Mantem o visual do site, so deixa tudo consistente e leve.
   ===================================================================== */

/* --- desempenho em celular e tablet: efeitos caros saem --- */
@media (max-width:1024px){
  *{backdrop-filter:none !important;-webkit-backdrop-filter:none !important}
  #capa .grain{display:none !important}
  .section-band video,.band-video{will-change:auto}
}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
}
/* blocos longos so sao desenhados quando chegam perto da tela */
.prod-block,.section-band,.veh-midband,.eg-banner{content-visibility:auto}
.prod-block{contain-intrinsic-size:1px 1200px}
.section-band,.veh-midband,.eg-banner{contain-intrinsic-size:1px 200px}

/* --- botoes: um padrao para o site todo --- */
button,.btn,input[type=submit],input[type=button]{cursor:pointer;font-family:'Oswald',sans-serif;-webkit-tap-highlight-color:transparent}
button:not(:disabled):active,.btn:not(.disabled):active{transform:translateY(1px)}
button:disabled,.btn.disabled,button[disabled]{opacity:.45;cursor:not-allowed;transform:none !important}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{
  outline:2px solid rgba(242,194,48,.9);outline-offset:2px;border-radius:8px}
button::-moz-focus-inner{border:0}
/* nao mexe nos botoes artisticos do menu/intro */
#capa .mitem,#blp-intro .intro-enter-btn,.lang-card{transform:none}

/* --- campos: legiveis e sem zoom automatico no iPhone --- */
input,select,textarea{font-family:'Oswald',sans-serif}
@media (max-width:768px){
  input,select,textarea{font-size:16px !important}
  button,.btn,.cart-btn-checkout,.adm-btn,.pja-add,.blp-btn{min-height:44px}
  .lg-btn{min-height:38px}
}

/* --- seletores do topo (moeda e pais) --- */
#blplang{gap:10px}
#blpcur .lg-btn,#blpmkt .lg-btn{background:rgba(0,0,0,.78);border:1px solid #2a2e36;border-radius:22px;padding:7px 14px;
  color:#fff;font-size:13px;letter-spacing:.5px;display:flex;align-items:center;gap:8px;transition:border-color .15s,background .15s}
#blpcur .lg-btn:hover,#blpmkt .lg-btn:hover{border-color:#F2C230;background:rgba(0,0,0,.9)}
#blpcur.open .lg-btn,#blpmkt.open .lg-btn{border-color:#F2C230}
#blpcur .lg-menu,#blpmkt .lg-menu{background:#0e0f12;border:1px solid #23262d;border-radius:12px;padding:6px;
  box-shadow:0 18px 50px rgba(0,0,0,.6)}
#blpcur .lg-item,#blpmkt .lg-item{border-radius:8px;transition:background .12s}
@media (max-width:640px){
  #blpcur .lg-menu,#blpmkt .lg-menu{position:fixed;left:8px;right:8px;top:58px;min-width:0;width:auto;max-height:70vh}
}

/* --- painel admin: o titulo nao fica mais atras dos seletores do topo --- */
#cat-admin .adm-head,#cat-admin .adm-title,#cat-admin h1{margin-top:46px}
@media (max-width:640px){#cat-admin .adm-head,#cat-admin .adm-title,#cat-admin h1{margin-top:60px}}

/* --- cartoes e tabelas do admin em telas pequenas --- */
@media (max-width:768px){
  #cat-admin .adm-card{padding:14px}
  #cat-admin .adm-row{flex-wrap:wrap}
  #cat-admin .adm-table{font-size:12.5px}
}

/* bloco 30 */

.mob-drawer-lbl{font:500 11px Oswald,sans-serif;letter-spacing:1.2px;color:#8a8f98;margin:4px 0 6px;text-transform:uppercase}
.mob-drawer-langs button{display:flex;align-items:center;gap:9px;width:100%;text-align:left;background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);border-radius:10px;color:#e6e8eb;font-family:'Oswald',sans-serif;font-size:14px;
  padding:11px 13px;margin-bottom:6px;min-height:44px}
.mob-drawer-langs button.on{border-color:#F2C230;color:#F2C230;background:rgba(242,194,48,.10)}
.mob-drawer-cur{display:grid;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:6px}
.mob-drawer-cur button{justify-content:center;padding:10px 6px;margin:0;font-size:13px;letter-spacing:.5px}

/* bloco 31 */

.shc-pill{display:inline-block;margin-left:8px;padding:2px 9px;border-radius:999px;background:rgba(242,194,48,.14);color:#F2C230;font:600 11.5px/1.7 Inter,system-ui,sans-serif;vertical-align:middle}
.shc-tools{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end;margin:12px 0 4px}
.shc-tools .adm-in{min-width:150px}
.shc-tools>.adm-in,.shc-tools>select.adm-in{width:auto!important;flex:0 1 190px}
#shc-q{flex:1 1 240px!important;width:auto!important;min-width:180px}
.shc-tools .shc-f{flex:0 1 auto}

#shc-q{flex:1 1 240px;min-width:180px}
.shc-chk{display:flex;align-items:center;gap:6px;color:#c6ccd4;font:500 12.5px/1 Inter,system-ui,sans-serif;padding:0 4px;white-space:nowrap}
.shc-chk input{width:16px;height:16px;accent-color:#F2C230}
.shc-b{border:1px solid rgba(255,255,255,.14);background:#2f343c;color:#e7eaee;border-radius:9px;padding:9px 14px;cursor:pointer;font:600 12.5px/1 Inter,system-ui,sans-serif;transition:.15s;white-space:nowrap}
.shc-b:hover{background:#3a404a;border-color:rgba(255,255,255,.26)}
.shc-b.gold{background:#F2C230;border-color:#F2C230;color:#16181c}
.shc-b.gold:hover{background:#ffd451}
.shc-b.ok{background:#1f7a4d;border-color:#1f7a4d;color:#fff}
.shc-b.ok:hover{background:#249159}
.shc-grp{margin-top:16px}
.shc-grp-h{font:600 12px/1 Inter,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#8b929c;padding:0 2px 8px;border-bottom:1px solid rgba(255,255,255,.08);display:flex;align-items:center;gap:8px}
.shc-grp-h span{background:rgba(255,255,255,.08);color:#c6ccd4;border-radius:999px;padding:2px 8px;letter-spacing:0;font-size:11px}
.shc-list{display:flex;flex-direction:column;gap:7px;margin-top:9px}
.shc{border:1px solid rgba(255,255,255,.09);border-radius:11px;background:#23262c;overflow:hidden;transition:border-color .15s,background .15s}
.shc:hover{border-color:rgba(255,255,255,.18)}
.shc.open{border-color:rgba(242,194,48,.45);background:#262a31}
.shc.off{opacity:.45}
.shc>header{display:flex;align-items:center;gap:11px;padding:11px 13px;cursor:pointer;user-select:none}
.shc-fl{font-size:20px;line-height:1;flex:0 0 auto}
.shc-id{flex:1 1 180px;min-width:120px;display:flex;flex-direction:column;gap:2px;overflow:hidden}
.shc-id b{color:#fff;font:600 14px/1.25 Oswald,Inter,sans-serif;letter-spacing:.2px}
.shc-id small{color:#868d97;font:400 11.5px/1.3 Inter,system-ui,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shc-bd{display:flex;flex-wrap:wrap;gap:5px;justify-content:flex-end;flex:1 1 auto}
.shc-tag{border-radius:999px;padding:3px 9px;font:600 10.5px/1.35 Inter,system-ui,sans-serif;background:rgba(255,255,255,.07);color:#aab1ba;white-space:nowrap}
.shc-tag.t-post{background:rgba(88,166,255,.15);color:#7fc0ff}
.shc-tag.t-exp{background:rgba(242,194,48,.15);color:#F2C230}
.shc-tag.t-par{background:rgba(120,200,140,.14);color:#83d59b}
.shc-tag.t-line{background:rgba(190,140,255,.15);color:#c4a0ff}
.shc-tag.t-brk{background:rgba(255,160,120,.14);color:#ffae86}
.shc-tag.t-frt{background:rgba(160,175,195,.14);color:#b3bdcc}
.shc-tag.gov{background:rgba(255,255,255,.06);color:#9aa2ac}
.shc-tag.ddp,.shc-tag.ioss{background:rgba(46,199,122,.13);color:#5fd69a}
.shc-tag.est{background:rgba(255,120,120,.12);color:#ff9d9d}
.shc-act{display:flex;align-items:center;gap:7px;flex:0 0 auto}
.shc-sw{position:relative;display:inline-block;width:36px;height:20px;flex:0 0 36px}
.shc-sw input{opacity:0;width:0;height:0;position:absolute}
.shc-sw i{position:absolute;inset:0;background:#454b55;border-radius:999px;transition:.18s;cursor:pointer}
.shc-sw i:before{content:"";position:absolute;width:14px;height:14px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.18s}
.shc-sw input:checked+i{background:#2ec77a}
.shc-sw input:checked+i:before{transform:translateX(16px)}
.shc-ib{width:28px;height:28px;border:1px solid rgba(255,255,255,.12);background:#2b2f36;color:#c6ccd4;border-radius:8px;cursor:pointer;font-size:13px;line-height:1;display:inline-flex;align-items:center;justify-content:center;transition:.15s}
.shc-ib:hover{background:#363c45;color:#fff}
.shc-ib.del:hover{background:#7a2020;border-color:#a33;color:#fff}
.shc-ar{color:#7d848e;font-size:10px;width:14px;text-align:center}
.shc-body{padding:4px 13px 15px;border-top:1px solid rgba(255,255,255,.08);background:#1f2228}
.shc-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:11px}
.shc-f{display:flex;flex-direction:column;gap:4px;min-width:0}
.shc-f>label{color:#8b929c;font:600 10.5px/1 Inter,system-ui,sans-serif;letter-spacing:.09em;text-transform:uppercase}
.shc-f .adm-in{width:100%}
.shc-chks{display:flex;flex-wrap:wrap;gap:10px;padding-top:6px}
.shc-chks label{display:flex;align-items:center;gap:5px;color:#c6ccd4;font:500 12px/1 Inter,system-ui,sans-serif;white-space:nowrap}
.shc-chks input{width:15px;height:15px;accent-color:#F2C230}
.shc-tbl-w{margin-top:14px;border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:11px 12px;background:#23262c}
.shc-tt{color:#e7eaee;font:600 12.5px/1.4 Inter,system-ui,sans-serif;margin-bottom:8px}
.shc-tt span{color:#868d97;font-weight:400;font-size:11.5px}
.shc-tbl{width:100%;border-collapse:collapse;font:400 12.5px/1.4 Inter,system-ui,sans-serif}
.shc-tbl th{color:#8b929c;font:600 10.5px/1 Inter,system-ui,sans-serif;letter-spacing:.07em;text-transform:uppercase;text-align:left;padding:5px 6px;border-bottom:1px solid rgba(255,255,255,.09);white-space:nowrap}
.shc-tbl td{padding:3px 6px;color:#c6ccd4;border-bottom:1px solid rgba(255,255,255,.05)}
.shc-tbl tr.mute td{opacity:.55}
.shc-tbl tr.win td{background:rgba(242,194,48,.08);color:#fff}
.shc-p{width:74px;background:#191c21;border:1px solid rgba(255,255,255,.1);border-radius:7px;color:#e7eaee;padding:6px 7px;font:400 12.5px/1 Inter,system-ui,sans-serif;text-align:right}
.shc-p:focus{outline:none;border-color:#F2C230;background:#14171b}
.shc-tbl.box .adm-in{width:100%;min-width:90px}
.shc-vol{color:#868d97;font-size:12px;white-space:nowrap}
.shc-acts{display:flex;gap:8px;flex-wrap:wrap}
.shc-f textarea.adm-in{font:400 12.8px/1.55 Inter,system-ui,sans-serif;resize:vertical}
.shc-hint{color:#868d97;font:400 11.5px/1.5 Inter,system-ui,sans-serif;margin-top:8px}
.shc-empty{color:#7f8794;font:400 13px/1.5 Inter,system-ui,sans-serif;padding:18px 4px}
@media(max-width:900px){
 .shc-acts{width:100%}
 .shc-id{flex:1 1 auto}
 .shc-id small{white-space:normal;overflow:visible}
 .shc-bd{display:none}
 .shc>header{gap:9px;padding:10px}
 .shc-tbl-w{overflow-x:auto}
 .shc-tbl{min-width:640px}
 .shc-f{flex:1 1 100%!important}
 .shc-tools .adm-in,.shc-tools select{flex:1 1 100%;min-width:0}
 .shc-b{flex:1 1 auto}
}

/* bloco 32 */

/* ===== Rotas, Locais e Radares no mapa ===== */
.mpp-dock{display:inline-flex;gap:6px}
#blmap-host .blmap-acts button.mpp-b{background:rgba(255,255,255,.06)!important;color:#dfe3e8!important}
#blmap-host .blmap-acts button.mpp-b.go{background:rgba(46,199,122,.18)!important;color:#7fe0a8!important}
#blmap-host .blmap-acts button.mpp-b.stop{background:rgba(255,80,80,.2)!important;color:#ff9d9d!important}
.mpp-speedo{position:absolute;left:12px;top:60px;z-index:37;display:none;align-items:stretch;gap:9px;background:rgba(9,11,15,.9);border:1px solid rgba(255,255,255,.14);border-radius:14px;padding:9px 11px;backdrop-filter:blur(10px)}
.mpp-speedo.on{display:flex}
.mpp-speedo.over{border-color:rgba(255,90,90,.85);box-shadow:0 0 0 3px rgba(255,80,80,.16)}
.mpp-speedo .sp-now{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:64px}
.mpp-speedo .sp-now b{color:#fff;font:700 30px/1 Oswald,Inter,sans-serif}
.mpp-speedo.over .sp-now b{color:#ff8585}
.mpp-speedo .sp-now span{color:#868d97;font:600 9.5px/1 Inter,system-ui,sans-serif;letter-spacing:.1em;margin-top:3px}
.mpp-speedo .sp-lim{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding-left:9px;border-left:1px solid rgba(255,255,255,.1)}
.mpp-speedo .sp-lim i{width:38px;height:38px;border-radius:50%;border:4px solid #e03a3a;background:#fff;color:#111;font:700 15px/30px Oswald,Inter,sans-serif;font-style:normal;text-align:center;display:block}
.mpp-speedo .sp-lim.off i{border-color:#4a505a;background:#1a1d22;color:#7f8794}
.mpp-speedo .sp-lim span{color:#868d97;font:600 8.5px/1 Inter,system-ui,sans-serif;letter-spacing:.07em;text-transform:uppercase;white-space:nowrap}
.mpp-speedo .sp-rad{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding-left:9px;border-left:1px solid rgba(255,255,255,.1);min-width:74px}
.mpp-speedo .sp-rad span{font-size:15px;line-height:1}
.mpp-speedo .sp-rad b{color:#ffd7ab;font:700 14px/1 Oswald,Inter,sans-serif}
.mpp-speedo .sp-rad.pol b{color:#cfe0ff}
.mpp-speedo .sp-rad small{color:#868d97;font:500 8.5px/1.2 Inter,system-ui,sans-serif;text-align:center;white-space:nowrap}
.mpp-speedo .sp-over{position:absolute;left:0;right:0;top:-24px;text-align:center;color:#ff8585;font:700 10.5px/1 Oswald,Inter,sans-serif;letter-spacing:.14em;animation:mppblink 1s infinite}
@media(max-width:860px){
 .mpp-speedo{left:10px;top:98px;padding:7px 9px;gap:7px}
 .mpp-speedo .sp-now b{font-size:22px}
 .mpp-speedo .sp-now{min-width:52px}
 .mpp-speedo .sp-lim i{width:32px;height:32px;border-width:3px;font-size:13px;line-height:26px}
 .mpp-speedo .sp-rad{min-width:62px}
 .mpp-hud{top:auto!important;bottom:76px!important}
 .blmap-grid.side-on .mpp-speedo{left:10px}
}
.mpp-hud{position:absolute;left:12px;top:60px;z-index:36;background:rgba(9,11,15,.9);border:1px solid rgba(242,194,48,.35);border-radius:14px;padding:11px 13px;backdrop-filter:blur(10px);min-width:186px;display:none}
.blmap-grid.run-on .mpp-hud{display:block}
.blmap-grid.side-on .mpp-hud{left:322px}
.blmap-grid.side-on .mpp-speedo{left:322px}
.mpp-hud{top:128px!important}
.mpp-hud .h{display:flex;align-items:center;gap:7px;color:var(--yellow,#F2C230);font:700 10.5px/1 Oswald,Inter,sans-serif;letter-spacing:.14em;text-transform:uppercase;margin-bottom:9px}
.mpp-hud .h i{width:7px;height:7px;border-radius:50%;background:#2ec77a;animation:mppblink 1.4s infinite}
@keyframes mppblink{0%,100%{opacity:1}50%{opacity:.25}}
.mpp-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px 12px}
.mpp-v{display:flex;flex-direction:column;gap:2px}
.mpp-v b{color:#fff;font:700 17px/1 Oswald,Inter,sans-serif}
.mpp-v span{color:#868d97;font:600 9.5px/1 Inter,system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase}
.mpp-v.big b{font-size:24px;color:var(--yellow,#F2C230)}
/* folha inferior */
.mpp-sheet{position:absolute;left:0;right:0;bottom:0;z-index:40;background:rgba(10,12,16,.97);border-top:1px solid rgba(255,255,255,.1);border-radius:16px 16px 0 0;transform:translateY(101%);transition:transform .26s cubic-bezier(.4,0,.2,1);max-height:74%;display:flex;flex-direction:column;backdrop-filter:blur(12px)}
.blmap-grid.sheet-on .mpp-sheet{transform:none}
.mpp-tabs{display:flex;gap:4px;padding:10px 12px 0;border-bottom:1px solid rgba(255,255,255,.08);position:relative}
.mpp-tabs button{border:0;background:transparent;color:#868d97;font:600 12px/1 Inter,system-ui,sans-serif;padding:10px 13px;border-radius:9px 9px 0 0;cursor:pointer;transition:.15s}
.mpp-tabs button:hover{color:#fff;background:rgba(255,255,255,.05)}
.mpp-tabs button.on{color:var(--yellow,#F2C230);background:rgba(242,194,48,.1);box-shadow:inset 0 -2px 0 var(--yellow,#F2C230)}
.mpp-x{position:absolute;right:10px;top:8px;width:30px;height:30px;border-radius:8px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:#c6ccd4;cursor:pointer;font-size:13px}
.mpp-x:hover{background:rgba(255,80,80,.18);color:#fff}
.mpp-body{overflow:auto;padding:14px;min-height:150px}
.mpp-row{display:flex;align-items:center;gap:10px;padding:9px 10px;border:1px solid rgba(255,255,255,.07);border-radius:11px;margin-bottom:7px;background:rgba(255,255,255,.02)}
.mpp-row:hover{border-color:rgba(255,255,255,.16)}
.mpp-row .ic{width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:15px;background:rgba(242,194,48,.13);color:var(--yellow,#F2C230);flex:0 0 34px}
.mpp-row .tx{flex:1;min-width:0}
.mpp-row .tx b{display:block;color:#fff;font:600 13px/1.3 Inter,system-ui,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mpp-row .tx span{color:#868d97;font:400 11.5px/1.4 Inter,system-ui,sans-serif}
.mpp-row .vl{color:var(--yellow,#F2C230);font:700 14px/1 Oswald,Inter,sans-serif;text-align:right;white-space:nowrap}
.mpp-row .del{border:0;background:rgba(255,255,255,.06);color:#9aa2ac;width:28px;height:28px;border-radius:8px;cursor:pointer}
.mpp-row .del:hover{background:rgba(255,80,80,.2);color:#fff}
.mpp-empty{color:#7f8794;font:400 12.5px/1.6 Inter,system-ui,sans-serif;text-align:center;padding:24px 10px}
.mpp-f{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px;align-items:flex-end}
.mpp-in{background:#14171c;border:1px solid rgba(255,255,255,.12);border-radius:9px;color:#e7eaee;padding:9px 11px;font:400 13px/1 Inter,system-ui,sans-serif;min-width:120px}
.mpp-in:focus{outline:none;border-color:var(--yellow,#F2C230)}
.mpp-lb{display:flex;flex-direction:column;gap:4px;flex:1 1 150px}
.mpp-lb>span{color:#868d97;font:600 10px/1 Inter,system-ui,sans-serif;letter-spacing:.09em;text-transform:uppercase}
.mpp-btn{border:0;background:var(--yellow,#F2C230);color:#15171b;border-radius:9px;padding:10px 15px;font:700 12px/1 Inter,system-ui,sans-serif;cursor:pointer;white-space:nowrap}
.mpp-btn:hover{background:#ffd451}
.mpp-btn.g{background:rgba(255,255,255,.08);color:#dfe3e8}
.mpp-btn.g:hover{background:rgba(255,255,255,.15)}
.mpp-note{color:#868d97;font:400 11.5px/1.55 Inter,system-ui,sans-serif;margin-top:10px;border-top:1px solid rgba(255,255,255,.07);padding-top:10px}
.mpp-chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.mpp-chip{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);color:#c6ccd4;border-radius:999px;padding:7px 12px;font:600 11.5px/1 Inter,system-ui,sans-serif;cursor:pointer}
.mpp-chip.on{background:rgba(242,194,48,.16);border-color:rgba(242,194,48,.5);color:var(--yellow,#F2C230)}
.mpp-pod{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-bottom:14px}
.mpp-pod>div{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:12px;text-align:center}
.mpp-pod b{display:block;color:var(--yellow,#F2C230);font:700 21px/1 Oswald,Inter,sans-serif}
.mpp-lvl{background:linear-gradient(135deg,rgba(242,194,48,.12),rgba(255,255,255,.03));border:1px solid rgba(242,194,48,.3);border-radius:14px;padding:13px 14px;margin-bottom:14px}
.mpp-lvl .lv-top{display:flex;align-items:center;gap:12px}
.mpp-lvl .lv-ico{font-size:26px;line-height:1}
.mpp-lvl .lv-tx{flex:1;min-width:0}
.mpp-lvl .lv-tx b{display:block;color:#fff;font:700 17px/1.2 Oswald,Inter,sans-serif;letter-spacing:.4px}
.mpp-lvl .lv-tx span{color:#9aa2ac;font:400 11.5px/1.4 Inter,system-ui,sans-serif}
.mpp-lvl .lv-pts{color:var(--yellow,#F2C230);font:700 24px/1 Oswald,Inter,sans-serif}
.mpp-lvl .lv-bar{height:7px;border-radius:99px;background:rgba(255,255,255,.1);margin:11px 0 7px;overflow:hidden}
.mpp-lvl .lv-bar i{display:block;height:100%;background:linear-gradient(90deg,#F2C230,#ffe08a);border-radius:99px;transition:width .5s}
.mpp-lvl .lv-nx{color:#9aa2ac;font:400 11.5px/1 Inter,system-ui,sans-serif}
.mpp-lvl .lv-nx b{color:var(--yellow,#F2C230)}
.mpp-pts{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:7px;margin-bottom:6px}
.mpp-pts>div{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);border-radius:9px;padding:8px 10px}
.mpp-pts b{color:var(--yellow,#F2C230);font:700 15px/1 Oswald,Inter,sans-serif;min-width:26px}
.mpp-pts span{color:#9aa2ac;font:400 11.5px/1.35 Inter,system-ui,sans-serif}
.mpp-badges{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:7px;margin-bottom:6px}
.bdg{display:flex;flex-direction:column;align-items:center;gap:5px;padding:11px 7px;border:1px solid rgba(255,255,255,.07);border-radius:11px;background:rgba(255,255,255,.02);opacity:.4;transition:.15s;cursor:default}
.bdg span{font-size:19px;line-height:1;filter:grayscale(1)}
.bdg b{color:#c6ccd4;font:600 10.5px/1.3 Inter,system-ui,sans-serif;text-align:center}
.bdg.on{opacity:1;border-color:rgba(242,194,48,.45);background:rgba(242,194,48,.08)}
.bdg.on span{filter:none}
.bdg.on b{color:#fff}
.mpp-prof{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:14px 0 4px;padding:11px 12px;border:1px solid rgba(255,255,255,.09);border-radius:11px;background:rgba(255,255,255,.03)}
.mpp-prof label,.mpp-prof>span{display:flex;align-items:center;gap:8px;color:#c6ccd4;font:500 12.5px/1.4 Inter,system-ui,sans-serif;flex:1 1 200px}
.mpp-prof input[type=checkbox]{width:16px;height:16px;accent-color:#F2C230}
.mpp-pod span{color:#868d97;font:600 9.5px/1.3 Inter,system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase}
/* aviso de radar na tela */
.mpp-alert{position:absolute;left:50%;top:62px;visibility:hidden;opacity:0;transform:translateX(-50%) translateY(-140%);z-index:45;background:linear-gradient(180deg,#8f1d1d,#5d1212);border:1px solid rgba(255,120,120,.55);border-radius:14px;padding:12px 16px;display:flex;align-items:center;gap:12px;box-shadow:0 12px 40px rgba(0,0,0,.6);transition:transform .3s cubic-bezier(.2,1.2,.4,1);min-width:250px}
.mpp-alert.on{visibility:visible;opacity:1;transform:translateX(-50%) translateY(0)}
.mpp-alert .i{font-size:22px}
.mpp-alert b{display:block;color:#fff;font:700 14px/1.2 Oswald,Inter,sans-serif;letter-spacing:.5px}
.mpp-alert span{color:#ffd0d0;font:400 11.5px/1.4 Inter,system-ui,sans-serif}
.mpp-alert .d{margin-left:auto;text-align:right}
.mpp-alert .d b{color:#ffe08a;font-size:20px}
.mpp-alert .d span{color:#ffc9c9;font-size:10px;text-transform:uppercase;letter-spacing:.08em}
.mpp-rad{display:inline-flex;align-items:center;gap:5px;background:rgba(12,14,18,.92);border:1px solid rgba(255,157,60,.8);color:#ffd7ab;border-radius:999px;padding:3px 9px;font:600 10.5px/1.3 Inter,system-ui,sans-serif;white-space:nowrap;transform:translate(-50%,-50%);box-shadow:0 3px 12px rgba(0,0,0,.55)}
.mpp-rad.pol{border-color:rgba(150,140,255,.9);color:#c9c2ff}
.mpp-rad.usr{border-color:rgba(242,194,48,.8);color:#F2C230}
.mpp-pl{display:inline-flex;align-items:center;gap:5px;background:rgba(12,14,18,.92);border:1px solid rgba(127,224,168,.7);color:#c9f3dd;border-radius:999px;padding:3px 9px;font:600 10.5px/1.3 Inter,system-ui,sans-serif;white-space:nowrap;transform:translate(-50%,-50%);box-shadow:0 3px 12px rgba(0,0,0,.55)}
.mpp-pl.biz{border-color:rgba(88,166,255,.7);color:#bcdcff}
.mpp-pl.part{border-color:rgba(242,194,48,.75);color:#F2C230}
.mpp-pl.meet{border-color:rgba(196,160,255,.75);color:#e2d2ff}
.mpp-pl.gar{border-color:rgba(255,157,60,.7);color:#ffd7ab}
@media(max-width:860px){
 .mpp-hud{left:10px;top:56px;min-width:0;padding:9px 11px}
 .mpp-hud .mpp-grid{gap:7px 10px}
 .mpp-v b{font-size:15px}.mpp-v.big b{font-size:20px}
 .blmap-grid.side-on .mpp-hud{left:10px}
 .mpp-sheet{max-height:80%}
 .mpp-pod{grid-template-columns:repeat(3,1fr);gap:6px}
 .mpp-pod b{font-size:17px}
}


/* bloco 33 - correcoes 24/09: menu lateral do celular e capa */
@media(max-width:1024px){
  .mob-drawer>*{flex:0 0 auto !important}
  .mob-drawer-item{min-height:48px;height:auto;line-height:1.25;flex-wrap:nowrap}
  .mob-drawer-item+.mob-drawer-item{margin-top:7px}
  .mob-drawer-item span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
  #mobDrawerLangs{display:flex;flex-direction:column;flex-wrap:nowrap;gap:0;width:100%;align-items:stretch}
  #mobDrawerLangs>*{flex:0 0 auto;width:100%;max-width:100%;min-width:0}
  .mob-grp{width:100%;margin-bottom:9px}
  .mob-grp-dica{width:100%;word-break:break-word}
  .mob-grp-b>button{min-height:44px;height:auto}
  .mob-grp-b .mob-drawer-cur button{min-height:42px;height:auto}
  .mob-drawer-h{margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:16px;width:calc(100% + 32px)}
}
@media(max-width:1024px) and (orientation:portrait){
  #capa:not(.entered) .mm-title{max-width:100%;font-size:min(44px,11.5vw) !important;line-height:1.08;overflow-wrap:anywhere}
  #capa:not(.entered) .mm-section{max-width:100%;overflow-wrap:anywhere}
}

/* bloco 34 - 25/09: ranking no celular sem arrastar pro lado */
@media(max-width:760px){
  #cat-blacklist .bl-tblwrap{overflow-x:hidden}
  #cat-blacklist .bl-tbl{display:block;width:100%}
  #cat-blacklist .bl-tbl thead{display:none}
  #cat-blacklist .bl-tbl tbody{display:block;width:100%}
  #cat-blacklist .bl-tbl tr{display:flex;flex-wrap:wrap;align-items:baseline;gap:3px 10px;padding:13px 14px;border-top:1px solid var(--line);width:100%}
  #cat-blacklist .bl-tbl td{display:block;padding:0;border:0;max-width:100%;min-width:0}
  #cat-blacklist .bl-tbl td:first-child{flex:0 0 auto;font-family:'Racing Sans One',sans-serif;color:var(--yellow);font-size:17px}
  #cat-blacklist .bl-tbl td:nth-child(2){flex:1 1 55%;min-width:0;overflow-wrap:anywhere}
  #cat-blacklist .bl-tbl td.bl-sp{margin-left:auto;flex:0 0 auto;text-align:right}
  #cat-blacklist .bl-tbl td:nth-child(n+4){flex:1 0 100%;color:#aeb3bb;font-size:13px;overflow-wrap:anywhere}
  #cat-blacklist .bl-mods{display:inline;color:#8a8f98}
}

/* bloco 35 - 25/09: a barra de forca da senha parecia barra de rolagem */
.pw-meter{display:flex;align-items:center;gap:10px;margin:9px 0 2px}
.pw-meter .pw-bar{flex:1 1 auto;height:6px;border-radius:4px;background:rgba(255,255,255,.09);box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)}
.pw-meter .pw-lbl{flex:0 0 auto;min-width:76px;text-align:right;color:#8a8f98}
.pw-meter .pw-lbl:empty::after{content:'FORÇA';opacity:.5}
/* foto do Tej no topo do chat: se o arquivo existir, ela cobre o emoji */
#tej-ov .tej-av{position:relative;overflow:hidden;border-radius:50%;flex:none}
#tej-ov .tej-av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 22%;border-radius:50%;z-index:2}

/* ===== TEJ v2: conversa, digitando, lancador ===== */
#tej-ov{position:fixed;inset:0;z-index:10098;background:rgba(0,0,0,.72);backdrop-filter:blur(4px);display:none;align-items:flex-end;justify-content:center;padding:0}
#tej-ov.on{display:flex}
@media(min-width:721px){#tej-ov{align-items:center;padding:24px}}
#tej-ov .tej-box{width:min(520px,100%);max-height:min(88vh,760px);display:flex;flex-direction:column;background:#0e0f12;border:1px solid #23262d;border-radius:18px 18px 0 0;overflow:hidden;box-shadow:0 -20px 60px rgba(0,0,0,.7)}
@media(min-width:721px){#tej-ov .tej-box{border-radius:18px}}
#tej-ov .tej-h{display:flex;align-items:center;gap:12px;padding:13px 15px;background:linear-gradient(180deg,#151922,#0e0f12);border-bottom:1px solid #23262d;flex:none}
#tej-ov .tej-av{position:relative;width:46px;height:46px;border-radius:50%;overflow:hidden;flex:none;display:flex;align-items:center;justify-content:center;background:#F2C230;color:#111;font-size:20px;border:2px solid rgba(242,194,48,.55)}
#tej-ov .tej-av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 20%;z-index:2}
#tej-ov .tej-hn{flex:1;min-width:0}
#tej-ov .tej-hn b{display:block;color:#fff;font-family:'Oswald',sans-serif;font-size:16px;letter-spacing:.4px}
#tej-ov .tej-hn span{display:block;color:#7fe0a8;font-size:11.5px;margin-top:1px}
#tej-ov .tej-x{background:none;border:0;color:#8a8f98;font-size:26px;line-height:1;cursor:pointer;padding:0 4px}
#tej-ov .tej-msgs{flex:1;overflow-y:auto;padding:16px 14px;display:flex;flex-direction:column;gap:9px;background:#0a0b0d;min-height:180px}
#tej-ov .tej-m{max-width:82%;padding:10px 13px;border-radius:15px;font-size:14px;line-height:1.45;word-wrap:break-word;animation:tejIn .22s ease both}
@keyframes tejIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
#tej-ov .tej-m.tej{align-self:flex-start;background:#1b1e24;color:#e9ebee;border-bottom-left-radius:5px}
#tej-ov .tej-m.me{align-self:flex-end;background:#F2C230;color:#15161a;border-bottom-right-radius:5px;font-weight:500}
#tej-ov .tej-typing{display:flex;gap:5px;align-items:center;padding:13px 15px}
#tej-ov .tej-typing i{width:7px;height:7px;border-radius:50%;background:#7a808a;display:block;animation:tejDot 1.1s infinite ease-in-out}
#tej-ov .tej-typing i:nth-child(2){animation-delay:.16s}
#tej-ov .tej-typing i:nth-child(3){animation-delay:.32s}
@keyframes tejDot{0%,60%,100%{opacity:.28;transform:translateY(0)}30%{opacity:1;transform:translateY(-4px)}}
#tej-ov .tej-chips{display:flex;gap:7px;overflow-x:auto;padding:10px 12px;background:#0e0f12;border-top:1px solid #191c22;flex:none;scrollbar-width:none}
#tej-ov .tej-chips::-webkit-scrollbar{display:none}
#tej-ov .tej-chips button{flex:none;background:rgba(242,194,48,.10);border:1px solid rgba(242,194,48,.34);color:#F2C230;border-radius:20px;padding:7px 13px;font-family:'Oswald',sans-serif;font-size:12.5px;white-space:nowrap;cursor:pointer}
#tej-ov .tej-chips button:hover{background:rgba(242,194,48,.2)}
#tej-ov .tej-bar{display:flex;gap:8px;padding:11px 12px calc(11px + env(safe-area-inset-bottom));background:#0e0f12;border-top:1px solid #23262d;flex:none}
#tej-ov .tej-bar input{flex:1;min-width:0;background:#16181d;border:1px solid #2a2e36;border-radius:22px;padding:11px 15px;color:#fff;font-size:14px;font-family:'Oswald',sans-serif;outline:none}
#tej-ov .tej-bar input:focus{border-color:#F2C230}
#tej-ov .tej-snd{background:#F2C230;border:0;border-radius:22px;padding:0 20px;color:#15161a;font-family:'Oswald',sans-serif;font-weight:600;font-size:13.5px;cursor:pointer}
#tej-launch{position:fixed;left:18px;bottom:calc(18px + env(safe-area-inset-bottom));z-index:9000;width:54px;height:54px;border-radius:50%;border:2px solid rgba(242,194,48,.6);background:#F2C230;color:#111;font-size:22px;cursor:pointer;padding:0;overflow:hidden;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 26px rgba(0,0,0,.55)}
#tej-launch img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 20%}
#tej-launch:hover{transform:scale(1.05)}
body.brand-open #tej-launch,body.music-open #tej-launch{display:none}
@media(max-width:720px){#tej-launch{width:48px;height:48px;left:14px;bottom:calc(74px + env(safe-area-inset-bottom))}}
#tej-ov .tej-voz{background:rgba(255,255,255,.06);border:1px solid #2a2e36;color:#8a8f98;font-size:16px;line-height:1;cursor:pointer;width:34px;height:34px;border-radius:50%;flex:none;margin-right:2px}
#tej-ov .tej-voz.on{background:rgba(242,194,48,.16);border-color:rgba(242,194,48,.55);color:#F2C230}
#cat-map .blmap-acts .a-tejvis,.blmap-acts .a-tejvis{background:rgba(255,255,255,.05);border:1px solid #2a2e36;color:#cfd3d9;border-radius:10px;padding:8px 12px;font-family:'Oswald',sans-serif;font-size:12px;letter-spacing:.5px;cursor:pointer;white-space:nowrap}
.blmap-acts .a-tejvis:hover{border-color:#F2C230;color:#F2C230}

/* ===== bloco 37: aviso rapido do Tej ===== */
#tej-aviso{position:fixed;left:50%;bottom:92px;transform:translateX(-50%) translateY(14px);z-index:99999;
  background:rgba(14,14,16,.96);color:#f4f4f4;border:1px solid rgba(255,214,0,.45);border-radius:999px;
  padding:10px 20px;font:600 13px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  letter-spacing:.2px;box-shadow:0 10px 30px rgba(0,0,0,.55);pointer-events:none;
  opacity:0;visibility:hidden;transition:opacity .18s ease,transform .18s ease,visibility .18s}
#tej-aviso.on{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
@media(max-width:560px){#tej-aviso{bottom:78px;font-size:12px;padding:9px 16px;max-width:88vw;text-align:center}}

/* ===== bloco 38: cartao do Tej no admin (Sections) ===== */
.tej-card{background:linear-gradient(180deg,rgba(255,214,0,.07),rgba(255,255,255,.02));
  border:1px solid rgba(255,214,0,.30);border-radius:14px;padding:16px 16px 13px;margin:0 0 20px}
.tej-card-h{display:flex;align-items:center;gap:12px;margin-bottom:13px}
.tej-card-h img{width:42px;height:42px;border-radius:50%;object-fit:cover;flex:0 0 42px;
  border:2px solid rgba(255,214,0,.55)}
.tej-card-h b{display:block;font:700 15px/1.2 Oswald,system-ui,sans-serif;color:#fff;letter-spacing:.4px}
.tej-card-h span{display:block;margin-top:3px;font:400 12px/1.35 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:#9b9b9b}
.tejc-opts{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.tejc-opt{text-align:left;cursor:pointer;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.10);
  border-radius:10px;padding:11px 12px;color:#ddd;transition:border-color .15s,background .15s,transform .1s}
.tejc-opt:hover{background:rgba(255,255,255,.07);border-color:rgba(255,214,0,.35)}
.tejc-opt:active{transform:scale(.985)}
.tejc-opt b{display:block;font:600 13px/1.25 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:#fff}
.tejc-opt i{display:block;margin-top:5px;font-style:normal;font:400 11.5px/1.4 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:#8f8f8f}
.tejc-opt.on{background:rgba(255,214,0,.13);border-color:rgba(255,214,0,.75);box-shadow:0 0 0 1px rgba(255,214,0,.25) inset}
.tejc-opt.on b{color:#ffd600}
.tejc-opt.on i{color:#c9b98a}
.tej-card-f{margin-top:12px;font:400 11.5px/1.45 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:#8f8f8f}
.tej-card-f b{color:#ccc}
@media(max-width:640px){.tejc-opts{grid-template-columns:1fr}.tejc-opt i{margin-top:3px}}

/* ===== bloco 39: botao de mudo dos avisos do mapa ===== */
.blmap-acts .mpp-b#mpp-mute{white-space:nowrap}
.blmap-acts .mpp-b#mpp-mute.off{opacity:.62;border-color:rgba(255,255,255,.14)}

/* ===== bloco 40: Tej consultor — produtos clicaveis no chat ===== */
#tej-msgs .tej-m.link{background:transparent;border:0;padding:0;margin:3px 0 0;max-width:100%}
#tej-msgs a.tej-p{display:block;text-decoration:none;background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.10);border-left:3px solid rgba(255,214,0,.7);border-radius:9px;
  padding:9px 12px;color:#dcdcdc;font:400 12.5px/1.4 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  transition:background .14s,border-color .14s}
#tej-msgs a.tej-p:hover{background:rgba(255,214,0,.10);border-color:rgba(255,214,0,.5);color:#fff}
#tej-msgs a.tej-p b{color:#ffd600;font-weight:700;letter-spacing:.2px}
#tej-msgs a.tej-p i{font-style:normal;color:#8fdc9e;font-weight:600;white-space:nowrap}
#tej-msgs a.tej-go{display:inline-block;text-decoration:none;margin-top:4px;
  background:rgba(255,214,0,.13);border:1px solid rgba(255,214,0,.55);border-radius:999px;
  padding:7px 15px;color:#ffd600;font:600 12px/1 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
#tej-msgs a.tej-go:hover{background:rgba(255,214,0,.22)}


/* ===== bloco 42: selo de peca universal / conferir encaixe ===== */
#tej-msgs a.tej-p em{display:inline-block;font-style:normal;margin-left:7px;vertical-align:1px;
  font:600 9.5px/1 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;letter-spacing:.3px;
  text-transform:uppercase;padding:3px 7px;border-radius:4px;white-space:nowrap}
#tej-msgs a.tej-p em.tej-uni{background:rgba(255,255,255,.10);color:#a9b4bd;border:1px solid rgba(255,255,255,.14)}
#tej-msgs a.tej-p em.tej-conf{background:rgba(224,164,23,.14);color:#e0a417;border:1px solid rgba(224,164,23,.42)}



/* ===== bloco 41: um botão só, com menu escrito (celular e tablet) ===== */
body.music-open #tej-launch{display:flex}

/* desktop: nada muda */
@media(min-width:1025px){
  #blp-fab,#blp-fab-menu,#blp-fab-bd{display:none !important}
  /* canto de baixo a esquerda, sem nada em cima de nada:
       linha de cima:  [Tej] [player de musica]
       linha de baixo: [idioma]                     */
  #tej-launch{left:18px !important;bottom:calc(80px + env(safe-area-inset-bottom)) !important;top:auto !important;right:auto !important}
  #capa .trax{left:88px !important;bottom:calc(80px + env(safe-area-inset-bottom)) !important;top:auto !important;right:auto !important;transform:none !important}
  #blp-lang-chip{display:flex !important;left:18px;bottom:calc(18px + env(safe-area-inset-bottom));top:auto;right:auto;position:fixed;z-index:10085}
}

/* celular e tablet: os botoes soltos somem, tudo vive no menu */
@media(max-width:1024px){
  #musicChip, #tej-launch, #blp-lang-chip, #blpchat-launch{display:none !important}
}

#blp-fab{
  position:fixed; left:16px; bottom:calc(16px + env(safe-area-inset-bottom));
  width:56px; height:56px; padding:0; z-index:10090;
  display:none; align-items:center; justify-content:center;
  border-radius:50%; border:1px solid rgba(242,194,48,.55);
  background:#F2C230; color:#111; cursor:pointer;
  box-shadow:0 10px 26px rgba(0,0,0,.55);
  touch-action:none; -webkit-tap-highlight-color:transparent;
  /* iOS: segurar apertado nao pode abrir o menu de copiar nem selecionar nada */
  -webkit-touch-callout:none; -webkit-user-select:none; user-select:none;
  transition:transform .16s ease, box-shadow .16s ease, background .16s ease;
}
#blp-fab *{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;pointer-events:none}
#blp-fab:active{transform:scale(.93)}
#blp-fab.solto{bottom:auto}
#blp-fab.arrastando{box-shadow:0 20px 44px rgba(0,0,0,.65);transform:scale(1.06);transition:none}
#blp-fab .fab-linhas{display:flex;flex-direction:column;gap:4px;align-items:center;transition:opacity .15s}
#blp-fab .fab-linhas i{display:block;width:20px;height:2.5px;border-radius:2px;background:#111}
#blp-fab .fab-linhas i:nth-child(2){width:14px}
#blp-fab .fab-x2{position:absolute;font-size:22px;line-height:1;color:#111;opacity:0;transform:rotate(-90deg);transition:opacity .15s,transform .18s}
#blp-fab.on{background:#fff;border-color:rgba(255,255,255,.6)}
#blp-fab.on .fab-linhas{opacity:0}
#blp-fab.on .fab-x2{opacity:1;transform:rotate(0)}

#blp-fab-bd{position:fixed;inset:0;z-index:10088;background:rgba(0,0,0,.55);
  opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s;backdrop-filter:blur(2px)}
#blp-fab-bd.on{opacity:1;visibility:visible}

#blp-fab-menu{
  position:fixed;z-index:10089;width:min(290px,84vw);
  background:#0e1015;border:1px solid #23262e;border-radius:16px;
  box-shadow:0 26px 60px rgba(0,0,0,.66);overflow:hidden;
  opacity:0;visibility:hidden;transform:translateY(10px) scale(.97);transform-origin:bottom left;
  transition:opacity .18s ease,transform .18s ease,visibility .18s;
}
#blp-fab-menu.on{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
#blp-fab-menu .fab-h{display:flex;align-items:center;justify-content:space-between;
  padding:13px 14px 11px;border-bottom:1px solid #1c1f26}
#blp-fab-menu .fab-h b{font:700 12px/1 Oswald,system-ui,sans-serif;letter-spacing:1.4px;
  text-transform:uppercase;color:#8d9099}
#blp-fab-menu .fab-x{width:30px;height:30px;border-radius:8px;border:0;background:transparent;
  color:#8d9099;font-size:15px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
#blp-fab-menu .fab-x:hover{background:#191c23;color:#fff}
#blp-fab-menu .fab-itens{padding:6px}
#blp-fab-menu .fab-it{display:flex;align-items:center;gap:12px;width:100%;
  padding:11px 10px;border:0;border-radius:11px;background:transparent;cursor:pointer;text-align:left}
#blp-fab-menu .fab-it:hover,#blp-fab-menu .fab-it:active{background:#171a21}
#blp-fab-menu .fab-ic{flex:0 0 40px;width:40px;height:40px;border-radius:50%;overflow:hidden;
  display:flex;align-items:center;justify-content:center;background:#1b1f27;border:1px solid #262a33;
  font-size:19px;line-height:1;color:#F2C230}
#blp-fab-menu .fab-ic img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
#blp-fab-menu .fab-tx{flex:1;min-width:0}
#blp-fab-menu .fab-tx b{display:block;font:600 14px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:#f1f1f3}
#blp-fab-menu .fab-tx i{display:block;margin-top:2px;font-style:normal;
  font:400 11.5px/1.3 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:#80838c;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#blp-fab-menu .fab-ar{color:#4e525c;font-size:18px;line-height:1;flex:0 0 auto}
#blp-fab-menu .fi-tej .fab-ic{border-color:rgba(242,194,48,.5)}

@media(max-width:380px){
  #blp-fab{width:50px;height:50px;left:14px}
  #blp-fab .fab-linhas i{width:18px}
}

/* alvo de toque decente pra fechar o chat e o player no celular */
@media(max-width:1024px){
  #tej-ov .tej-x{width:42px !important;height:42px !important;display:flex !important;
    align-items:center;justify-content:center;font-size:19px;border-radius:10px}
  #capa .trax .trax-x,#capa .trax #traxX{width:34px !important;height:34px !important;
    display:flex !important;align-items:center;justify-content:center;font-size:17px;border-radius:9px}
}

/* ===== bloco 45: Tej e chat por cima da capa =====
   #capa e fixed com z-index 9999. O botao do Tej estava em 9000, entao
   existia mas ficava enterrado embaixo da capa no desktop. */
#tej-launch{z-index:10085 !important}
#blpchat-launch{z-index:10085 !important}
#tej-ov{z-index:10092 !important}

/* a foto do Tej estava com lazy-load e nao pintava dentro do botao fixo:
   pinta como fundo tambem, e a bandeira so aparece se a foto sumir mesmo */
#tej-launch{background-image:url('/assets/tej.jpg?v=2');background-size:cover;background-position:50% 20%}
#tej-launch img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 20%}
#tej-launch img + span{display:none}
#blp-fab-menu .fi-tej .fab-ic{background-image:url('/assets/tej.jpg?v=2');background-size:cover;background-position:50% 20%}

/* ===== bloco 46: aparência do botão de idioma ===== */
#blp-lang-chip{
  position:fixed; z-index:10085;
  display:none; align-items:center; justify-content:center;
  width:46px; height:46px; padding:0; box-sizing:border-box;
  border-radius:50%; border:1px solid #2a2e36;
  background:rgba(0,0,0,.82); cursor:pointer;
  box-shadow:0 6px 18px rgba(0,0,0,.45);
  -webkit-tap-highlight-color:transparent;
  transition:transform .12s ease, border-color .15s ease;
}
#blp-lang-chip:hover{border-color:rgba(242,194,48,.6)}
#blp-lang-chip:active{transform:scale(.93)}
#blp-lang-chip .blc-flag{font-size:21px;line-height:1;display:block}
@media(max-width:1024px){ #blp-lang-chip{display:none !important} }

/* ---- lista de idiomas colada no botao da bandeira (desktop) ---- */
#blp-lang-pop{position:fixed;z-index:10120;background:#0e0f12;border:1px solid #23262d;border-radius:12px;
  padding:6px;min-width:210px;max-height:60vh;overflow:auto;box-shadow:0 18px 50px rgba(0,0,0,.6)}
#blp-lang-pop .blp-lp-it{display:block;width:100%;text-align:left;background:none;border:0;cursor:pointer;
  color:#e8eaee;font:400 14px Oswald,sans-serif;padding:9px 12px;border-radius:8px;white-space:nowrap}
#blp-lang-pop .blp-lp-it:hover{background:#1a1d23}
#blp-lang-pop .blp-lp-it.on{color:#F2C230;background:rgba(242,194,48,.08)}

/* ---- No celular o botao amarelo fica no alto da esquerda, espelhando o menu
     branco da direita. Embaixo ele tapava a frase "ONLY THE BUILT MAKE THE LIST".
     Quem arrastar continua mandando: a posicao arrastada e gravada inline com
     !important, e inline vence folha de estilo. ---- */
@media(max-width:1024px){
  #blp-fab{top:calc(14px + env(safe-area-inset-top)) !important;bottom:auto !important}
}

/* ---- botao de voltar ao menu principal (visivel em qualquer secao) ---- */
#blp-home-btn{position:fixed;z-index:10086;display:none;align-items:center;gap:8px;
  left:18px;top:calc(16px + env(safe-area-inset-top));
  padding:9px 15px 9px 12px;border-radius:999px;cursor:pointer;
  border:1px solid rgba(242,194,48,.5);background:rgba(10,11,13,.82);color:#F2C230;
  font:600 13px Oswald,sans-serif;letter-spacing:1px;text-transform:uppercase;
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  box-shadow:0 8px 22px rgba(0,0,0,.5);-webkit-tap-highlight-color:transparent;
  transition:transform .12s ease, background .15s ease}
#blp-home-btn:hover{background:rgba(242,194,48,.14)}
#blp-home-btn:active{transform:scale(.95)}
#blp-home-btn .bhb-seta{font-size:16px;line-height:1}
/* no celular o botao amarelo fica no alto da esquerda: este entra ao lado dele */
@media(max-width:1024px){
  #blp-home-btn{left:76px;top:calc(16px + env(safe-area-inset-top));padding:8px 13px 8px 10px;font-size:12px}
}

/* ---- esconde os botoes antigos (Main Menu / Back do topo da pagina):
     agora quem manda e o par fixo MENU + VOLTAR ---- */
.navbtns{display:none !important}
#blp-back-btn{position:fixed;z-index:10086;display:none;align-items:center;gap:7px;
  padding:9px 15px 9px 12px;border-radius:999px;cursor:pointer;
  border:1px solid rgba(255,255,255,.22);background:rgba(10,11,13,.82);color:#e8eaee;
  font:600 13px Oswald,sans-serif;letter-spacing:1px;text-transform:uppercase;
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  box-shadow:0 8px 22px rgba(0,0,0,.5);-webkit-tap-highlight-color:transparent;
  transition:transform .12s ease, background .15s ease}
#blp-back-btn:hover{background:rgba(255,255,255,.1)}
#blp-back-btn:active{transform:scale(.95)}
#blp-back-btn .bhb-seta{font-size:17px;line-height:1}
@media(max-width:1024px){ #blp-back-btn{padding:8px 13px 8px 10px;font-size:12px} }

/* ---- aviso das pecas de uso geral sem aplicacao cadastrada ---- */
.blp-semapl{margin:18px 0 4px;padding:14px 16px;border-radius:12px;
  border:1px solid rgba(242,194,48,.35);border-left:3px solid #F2C230;
  background:rgba(242,194,48,.06);display:flex;flex-direction:column;gap:6px}
.blp-semapl b{color:#F2C230;font:600 13.5px Oswald,sans-serif;letter-spacing:.4px}
.blp-semapl span{color:#b9bec6;font:400 12.5px Oswald,sans-serif;line-height:1.5}
.blp-semapl button{align-self:flex-start;margin-top:4px;padding:8px 14px;border-radius:999px;
  border:1px solid rgba(242,194,48,.55);background:transparent;color:#F2C230;cursor:pointer;
  font:600 12px Oswald,sans-serif;letter-spacing:1px;text-transform:uppercase}
.blp-semapl button:hover{background:rgba(242,194,48,.14)}

/* ---- nossas redes: canal do WhatsApp, Instagram, e-mail ---- */
.blp-redes{margin:22px 0 6px;padding:16px;border-radius:14px;border:1px solid #23262d;
  background:rgba(255,255,255,.02);display:flex;flex-direction:column;gap:9px}
.blp-redes .blr-cab{display:flex;flex-direction:column;gap:3px;margin-bottom:4px}
.blp-redes .blr-cab b{color:#F2C230;font:600 14px Oswald,sans-serif;letter-spacing:.6px;text-transform:uppercase}
.blp-redes .blr-cab span{color:#8d939c;font:400 12.5px Oswald,sans-serif;line-height:1.45}
.blp-redes .blr-it{display:flex;align-items:center;gap:12px;padding:11px 13px;border-radius:11px;
  border:1px solid #23262d;background:#0e0f12;text-decoration:none;transition:border-color .15s,background .15s}
.blp-redes .blr-it:hover{border-color:rgba(242,194,48,.5);background:#14161a}
.blp-redes .blr-it.blr-canal{border-color:rgba(37,211,102,.45);background:rgba(37,211,102,.06)}
.blp-redes .blr-it.blr-canal:hover{background:rgba(37,211,102,.12)}
.blp-redes .blr-ic{display:flex;align-items:center;justify-content:center;width:34px;flex:0 0 34px}
.blp-redes .blr-tx{display:flex;flex-direction:column;gap:1px;flex:1;min-width:0}
.blp-redes .blr-tx b{color:#e8eaee;font:600 13.5px Oswald,sans-serif;letter-spacing:.3px}
.blp-redes .blr-tx i{color:#8d939c;font:400 11.5px Oswald,sans-serif;font-style:normal;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.blp-redes .blr-ar{color:#5b6068;font-size:19px;line-height:1}
.blp-redes.compacto{flex-direction:row;flex-wrap:wrap;gap:8px;padding:12px;margin:14px 0}
.blp-redes.compacto .blr-it{flex:1 1 150px;padding:9px 11px}
.blp-redes.compacto .blr-ar{display:none}


/* ===== bloco 51: barra do Tej nunca corta o botao Send ===== */
/* O botao encolhia porque era item flex sem flex:none: com zoom do browser
   ou fonte grande, o texto "Send" ficava cortado pela borda do painel. */
#tej-ov .tej-bar{align-items:center;flex-wrap:nowrap;min-width:0}
#tej-ov .tej-snd{flex:0 0 auto !important;white-space:nowrap;min-width:max-content;
  padding:11px 18px;line-height:1;display:inline-flex;align-items:center;justify-content:center}
#tej-ov .tej-voz{flex:0 0 auto}
#tej-ov .tej-bar input{flex:1 1 auto;min-width:60px}
/* telas estreitas: o botao vira so o icone, em vez de espremer a caixa de texto */
@media(max-width:400px){
  #tej-ov .tej-snd{padding:11px 14px;font-size:12.5px}
  #tej-ov .tej-bar{gap:6px;padding-left:9px;padding-right:9px}
}
/* a caixa do Tej nunca passa da tela, em nenhum zoom */
#tej-ov .tej-box{max-width:100%;box-sizing:border-box}
#tej-ov .tej-m{max-width:min(82%,520px)}

/* ===== bloco 52: Tej guia de compra ===== */
#tej-volta{position:fixed;z-index:10120;display:none;align-items:center;gap:7px;
  left:50%;transform:translateX(-50%);bottom:calc(18px + env(safe-area-inset-bottom));
  background:#F2C230;color:#15161a;border:0;border-radius:24px;
  padding:10px 18px 10px 14px;font-family:'Oswald',sans-serif;font-size:13px;
  letter-spacing:.4px;cursor:pointer;box-shadow:0 10px 30px rgba(0,0,0,.5);
  animation:tejVoltaIn .22s ease both}
@keyframes tejVoltaIn{from{opacity:0;transform:translateX(-50%) translateY(8px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
#tej-volta:hover{background:#ffd34d}
#tej-volta:active{transform:translateX(-50%) scale(.96)}
#tej-volta .tv-a{font-size:17px;line-height:1}
@media(max-width:720px){ #tej-volta{bottom:calc(84px + env(safe-area-inset-bottom));font-size:12px;padding:9px 15px 9px 12px} }

/* botao do Tej arrastavel — no desktop tambem */
#tej-launch{touch-action:none;transition:box-shadow .15s ease}
#tej-launch.tej-solto{right:auto !important;bottom:auto !important}
#tej-launch.tej-arrastando{box-shadow:0 0 0 4px rgba(242,194,48,.35),0 14px 34px rgba(0,0,0,.6);cursor:grabbing;opacity:.92}
#tej-launch:hover{cursor:grab}
/* durante a compra ele continua la, mesmo com outras janelas abertas */
#tej-launch.tej-compra{display:flex !important;z-index:10125}

/* ===== bloco 53: contadores ao vivo ===== */
.blp-cont{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0 0;justify-content:center}
.blp-cont i{display:flex;flex-direction:column;align-items:center;gap:2px;font-style:normal;
  background:rgba(255,255,255,.04);border:1px solid rgba(242,194,48,.22);border-radius:12px;
  padding:10px 16px;min-width:104px}
.blp-cont i b{font-family:'Oswald',sans-serif;font-size:19px;color:#F2C230;line-height:1;letter-spacing:.5px}
.blp-cont i span{font-size:10.5px;color:#8a8f98;letter-spacing:.4px;text-align:center;line-height:1.25}
@media(max-width:420px){ .blp-cont i{padding:8px 12px;min-width:92px} .blp-cont i b{font-size:17px} }

/* ===== bloco 55: o Tej nao desaparece a meio da compra =====
   A regra antiga escondia o botao do Tej sempre que uma pagina de marca ou
   categoria abria (body.brand-open) — ou seja, sumia exactamente quando o
   cliente esta a escolher a peca e tem duvidas. Como a fileira do desktop
   agora poe Tej, musica e idioma lado a lado sem se tocarem, e como no
   telemovel o botao e arrastavel, ja nao ha razao para o esconder. */
body.brand-open #tej-launch{display:flex !important}
body.music-open #tej-launch{display:flex !important}

/* ===== bloco 57: aviso de "Tej recolhido" ===== */
#tej-aviso{position:fixed;left:50%;transform:translateX(-50%) translateY(14px);
  bottom:calc(96px + env(safe-area-inset-bottom));z-index:10130;
  background:#15171b;color:#eee;border:1px solid rgba(242,194,48,.5);border-radius:24px;
  padding:11px 18px;font:500 13px/1.35 Oswald,sans-serif;max-width:calc(100vw - 40px);
  text-align:center;opacity:0;pointer-events:none;transition:opacity .22s ease,transform .22s ease;
  box-shadow:0 10px 30px rgba(0,0,0,.55)}
#tej-aviso.on{opacity:1;transform:translateX(-50%) translateY(0)}
@media(max-width:400px){ #tej-aviso{font-size:12px;padding:10px 14px} }

/* ===== bloco 59: TABLET — cada botao no seu lugar ==========================
   O Braga desenhou: no vertical o Tej e a bandeira do mesmo lado e a musica
   do outro, em RECTANGULO (nao a bolinha). No horizontal o Tej a esquerda, a
   musica ao lado dele e a bandeira do outro lado da frase.
   Aqui so mostramos os tres e devolvemos o rectangulo a musica; QUEM POE cada
   um no lugar e o bloco 58 do blp.js, porque os tamanhos mudam com o idioma e
   com o estado do player e nao da para fixar coordenadas.
   A altura minima de 520px exclui o telefone deitado, que tem largura de
   tablet mas e telefone.
   ========================================================================= */
@media(min-width:721px) and (max-width:1024px) and (min-height:520px){

  /* os tres deixam de viver escondidos dentro do botao amarelo */
  #tej-launch{display:flex !important}
  #blp-lang-chip{display:flex !important}

  /* o botao amarelo nao e preciso no tablet: os tres estao a vista */
  #blp-fab,#blp-fab-menu,#blp-fab-bd{display:none !important}

  /* MUSICA EM RECTANGULO (no telefone vertical ela era forcada a bolinha) */
  .music-chip,#capa .music-chip{
    width:auto !important;height:auto !important;
    border-radius:30px !important;
    padding:10px 18px 10px 13px !important;
    gap:9px !important;
    background:rgba(15,15,17,.95) !important;
    border:1px solid rgba(242,194,48,.5) !important;
    z-index:10086 !important}
  .music-chip b,#capa .music-chip b{
    display:inline !important;font:600 12px Oswald,sans-serif !important;
    letter-spacing:1px;text-transform:uppercase;color:#fff}
  .music-chip .n,#capa .music-chip .n{
    width:24px !important;height:24px !important;font-size:12px !important;
    border-radius:50% !important;border:1px solid #F2C230 !important;color:#F2C230 !important;
    display:flex !important;align-items:center;justify-content:center;flex:0 0 auto}

  /* o player, quando aberto, fica onde o bloco 58 puser: sem o centro forcado */
  body.music-open #capa .trax,body.music-open .trax{
    left:auto !important;transform:none !important;
    top:auto !important;
    width:min(62vw,360px) !important;max-width:360px !important}

  /* tamanhos confortaveis de dedo, sem exagero de tablet */
  #tej-launch{width:56px !important;height:56px !important;z-index:10085 !important}
  #blp-lang-chip{z-index:10086 !important;padding:9px 13px !important;font-size:18px !important}
}

/* TABLET VERTICAL: a pastilha MUSIC a vista, o player so quando se abre */
@media(min-width:721px) and (max-width:1024px) and (min-height:520px) and (orientation:portrait){
  #capa .music-chip,.music-chip{display:flex !important}
  body.music-open .music-chip,body.music-open #capa .music-chip{display:none !important}
}
/* TABLET DEITADO: manda o player (e o rectangulo grande); a pastilha so
   aparece quando alguem fecha o player, e nunca os dois ao mesmo tempo */
@media(min-width:721px) and (max-width:1024px) and (min-height:520px) and (orientation:landscape){
  #capa .music-chip,.music-chip{display:none !important}
  #capa .music-chip.show,.music-chip.show{display:flex !important}
  body.music-open .music-chip,body.music-open #capa .music-chip{display:none !important}
}

/* iPad DEITADO (1025-1366 com dedo): o desktop punha os tres em fila no canto
   de baixo a esquerda, um em cima do outro quando o player abria. Quem arruma
   passa a ser o bloco 58; aqui so garantimos que nada os esconda. */
@media(min-width:1025px) and (max-width:1366px) and (pointer:coarse){
  #tej-launch,#blp-lang-chip{display:flex !important}
  #blp-fab,#blp-fab-menu,#blp-fab-bd{display:none !important}
  .music-chip,#capa .music-chip{
    width:auto !important;height:auto !important;border-radius:30px !important;
    padding:10px 18px 10px 13px !important}
  .music-chip b,#capa .music-chip b{display:inline !important}
}

/* ===== bloco 60: o kit que o Tej monta =====================================
   Cada etapa e um cartao com as pecas que existem MESMO para aquele carro:
   marca, nome, preco, o selo do que e certo para o chassis, e dois botoes —
   ver a peca e meter no carrinho. No fim, o kit todo de uma vez.
   ========================================================================= */
#tej-msgs .tej-m .tej-kit{margin:2px 0 8px;border:1px solid #2a2e36;border-radius:12px;
  background:rgba(10,11,13,.5);overflow:hidden}
#tej-msgs .tej-m .tk-h{display:flex;flex-direction:column;gap:2px;padding:9px 12px;
  background:rgba(242,194,48,.10);border-bottom:1px solid #2a2e36}
#tej-msgs .tej-m .tk-h b{font:600 13px Oswald,sans-serif;letter-spacing:.6px;text-transform:uppercase;color:#F2C230}
#tej-msgs .tej-m .tk-h i{font-style:normal;font-size:12px;line-height:1.35;color:#9aa0a8}
#tej-msgs .tej-m .tk-it{padding:9px 12px;border-bottom:1px solid #1e2127}
#tej-msgs .tej-m .tk-it:last-child{border-bottom:0}
#tej-msgs .tej-m .tk-n{font-size:13px;line-height:1.38;color:#e8eaee}
#tej-msgs .tej-m .tk-n b{color:#fff;font-weight:600}
#tej-msgs .tej-m .tk-m{margin-top:3px;font-size:11.5px;color:#8c9299}
#tej-msgs .tej-m .tk-p{color:#F2C230;font-weight:600}
#tej-msgs .tej-m .tk-b{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
#tej-msgs .tej-m .tk-b a{display:inline-block;text-decoration:none;cursor:pointer;
  font:600 12px Oswald,sans-serif;letter-spacing:.4px;padding:7px 12px;border-radius:999px;
  border:1px solid rgba(255,255,255,.16);color:#e8eaee;background:rgba(255,255,255,.04);
  -webkit-tap-highlight-color:transparent}
#tej-msgs .tej-m .tk-b a.tk-c{border-color:rgba(242,194,48,.55);color:#F2C230;background:rgba(242,194,48,.10)}
#tej-msgs .tej-m .tk-b a:active{transform:scale(.97)}
#tej-msgs .tej-m .tk-b a.posto{border-color:rgba(76,201,110,.5);color:#6ede8a;background:rgba(76,201,110,.12)}
#tej-msgs .tej-m .tk-vazio{padding:10px 12px;font-size:12.5px;line-height:1.4;color:#9aa0a8}
#tej-msgs .tej-m .tk-fim{padding:2px 0}
#tej-msgs .tej-m .tk-fim b{color:#fff;font-size:13px}
#tej-msgs .tej-m a.tk-todo{display:inline-block;margin-top:6px;text-decoration:none;cursor:pointer;
  font:600 13px Oswald,sans-serif;letter-spacing:.6px;text-transform:uppercase;
  padding:9px 16px;border-radius:999px;border:1px solid rgba(242,194,48,.7);
  color:#15161a;background:#F2C230}
#tej-msgs .tej-m a.tk-todo.posto{background:rgba(76,201,110,.16);color:#6ede8a;border-color:rgba(76,201,110,.5)}
@media(max-width:480px){
  #tej-msgs .tej-m .tk-n{font-size:12.5px}
  #tej-msgs .tej-m .tk-b a{padding:8px 11px}
}

/* a bolha que leva um kit usa a largura toda do chat */
#tej-ov .tej-m.kit,#tej-msgs .tej-m.kit{max-width:97% !important;width:97%;
  background:transparent !important;border:0 !important;padding:0 !important}

/* ===== bloco 61: caixa por cima de caixa no menu (idioma/moeda/país) ======
   O cabeçalho de cada grupo (LANGUAGE, CURRENCY, COUNTRY & SHIPPING) e um
   <button> dentro de .mob-drawer-langs, e apanhava o estilo dos botoes da
   lista de idiomas: borda, fundo e margem de baixo. Resultado: a caixa do
   grupo desenhava uma borda e o cabecalho desenhava outra por dentro, com
   6px a mais — dois botoes um em cima do outro, no telemovel e no tablet.
   Aqui o cabecalho volta a ser so o cabecalho.
   ========================================================================= */
.mob-drawer .mob-grp>.mob-grp-h,
.mob-drawer-langs .mob-grp>.mob-grp-h,
.mob-drawer-langs>.mob-grp>.mob-grp-h{
  background:none !important;
  border:0 !important;
  border-radius:0 !important;
  margin:0 !important;
  padding:13px !important;
  min-height:0 !important;
  width:100% !important}

/* ===== bloco 63: fotos honestas no cartao do produto ======================
   Logotipo nao e foto de peca: aparece centrado, como marca, com etiqueta.
   Imagem que serve dezenas de referencias leva "foto de categoria".
   ========================================================================= */
.prod-card .pc-ph{position:relative}
.prod-card .pc-ph[data-foto="sem"]{background:#0e0f12 !important}
.prod-card .pc-ph[data-foto="sem"] img{
  object-fit:contain !important;padding:16% !important;
  filter:grayscale(.2) brightness(1.05);opacity:.92}
.prod-card:hover .pc-ph[data-foto="sem"] img{transform:none !important}
.prod-card .pc-ph .pc-fotonota{
  position:absolute;left:8px;bottom:8px;z-index:2;pointer-events:none;
  font:600 9.5px Oswald,sans-serif;letter-spacing:.7px;text-transform:uppercase;
  padding:3px 7px;border-radius:999px;
  background:rgba(10,11,13,.82);color:#c9ccd2;border:1px solid rgba(255,255,255,.14);
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.prod-card .pc-ph[data-foto="sem"] .pc-fotonota{color:#F2C230;border-color:rgba(242,194,48,.38)}
@media(max-width:480px){ .prod-card .pc-ph .pc-fotonota{font-size:9px;left:6px;bottom:6px;padding:2px 6px} }

/* ===== bloco 64: tabela das marcas no admin ==============================
   Uma tabela por prateleira: marca, quantas pecas tem mesmo, interruptor
   para ligar/desligar e botao para tirar do site — com guardar no fim.
   ========================================================================= */
#marcas-admin{font-family:'Oswald',sans-serif}
#marcas-admin .mk-topo{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin:4px 0 18px}
#marcas-admin .mk-kpi{background:rgba(255,255,255,.03);border:1px solid #23262d;border-radius:12px;padding:12px 14px}
#marcas-admin .mk-kpi b{display:block;color:#F2C230;font-size:24px;line-height:1.1;font-weight:600}
#marcas-admin .mk-kpi span{display:block;margin-top:2px;color:#8a8f98;font-size:11.5px;letter-spacing:.6px;text-transform:uppercase}

#marcas-admin .mk-bloco{margin:0 0 20px;border:1px solid #23262d;border-radius:14px;overflow:hidden;background:rgba(10,11,13,.35)}
#marcas-admin .mk-bloco-h{display:flex;align-items:baseline;gap:10px;padding:11px 15px;background:rgba(242,194,48,.09);
  border-bottom:1px solid #23262d;color:#F2C230;font-size:13.5px;letter-spacing:1px;text-transform:uppercase;font-weight:600}
#marcas-admin .mk-bloco-h i{font-style:normal;color:#8a8f98;font-size:11.5px;letter-spacing:.4px;text-transform:none}

#marcas-admin .mk-tab{width:100%;border-collapse:collapse}
#marcas-admin .mk-tab th{text-align:left;padding:8px 15px;color:#7a808a;font-size:10.5px;letter-spacing:1.1px;
  text-transform:uppercase;font-weight:500;border-bottom:1px solid #1c1f25;background:rgba(255,255,255,.015)}
#marcas-admin .mk-tab td{padding:10px 15px;border-bottom:1px solid #16181d;vertical-align:middle}
#marcas-admin .mk-tab tr:last-child td{border-bottom:0}
#marcas-admin .mk-row:hover td{background:rgba(255,255,255,.022)}
#marcas-admin .mk-row.off td,#marcas-admin .mk-row.del td{opacity:.5}

#marcas-admin .mk-c-marca{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
#marcas-admin .mk-logo{width:26px;height:26px;object-fit:contain;flex:0 0 auto;filter:brightness(1.6)}
#marcas-admin .mk-nome{color:#fff;font-size:14.5px}
#marcas-admin .mk-extra{color:#7a808a;font-size:11px;width:100%;padding-left:36px;margin-top:-2px}
#marcas-admin .mk-c-n{white-space:nowrap;width:110px}
#marcas-admin .mk-c-n b{color:#e8eaee;font-size:14px;font-weight:600}
#marcas-admin .mk-c-n i{color:#7a808a;font-size:11px;font-style:normal;margin-left:4px}
#marcas-admin .mk-c-on{width:86px;text-align:center}
#marcas-admin .mk-c-x{width:96px;text-align:right}
#marcas-admin .mk-dash{color:#4a4f57}

#marcas-admin .mk-tag{display:inline-block;padding:3px 9px;border-radius:999px;font-size:10.5px;letter-spacing:.6px;text-transform:uppercase}
#marcas-admin .mk-tag.zero{background:rgba(233,75,75,.12);color:#ff9c9c;border:1px solid rgba(233,75,75,.3)}
#marcas-admin .mk-tag.fora{background:rgba(255,255,255,.05);color:#9aa0a8;border:1px solid #2a2e36}

/* interruptor */
#marcas-admin .mk-sw{display:inline-block;position:relative;width:46px;height:26px;cursor:pointer;vertical-align:middle}
#marcas-admin .mk-sw input{position:absolute;opacity:0;width:0;height:0}
#marcas-admin .mk-sw span{position:absolute;inset:0;border-radius:999px;background:#2a2e36;border:1px solid #33383f;
  transition:background .18s ease,border-color .18s ease}
#marcas-admin .mk-sw span::after{content:'';position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;
  background:#8a8f98;transition:transform .18s ease,background .18s ease}
#marcas-admin .mk-sw input:checked+span{background:rgba(242,194,48,.22);border-color:rgba(242,194,48,.65)}
#marcas-admin .mk-sw input:checked+span::after{transform:translateX(20px);background:#F2C230}

#marcas-admin .mk-btn{background:none;border:1px solid #33383f;color:#c9ccd2;border-radius:999px;
  padding:6px 13px;font:500 12px Oswald,sans-serif;letter-spacing:.5px;cursor:pointer;transition:.15s}
#marcas-admin .mk-btn.x:hover{border-color:rgba(233,75,75,.6);color:#ff9c9c;background:rgba(233,75,75,.08)}
#marcas-admin .mk-btn.repor{border-color:rgba(242,194,48,.5);color:#F2C230}
#marcas-admin .mk-btn.repor:hover{background:rgba(242,194,48,.12)}

#marcas-admin .mk-fim{position:sticky;bottom:0;margin-top:22px;padding:14px 0 4px;
  background:linear-gradient(180deg,rgba(14,15,18,0),rgba(14,15,18,.96) 34%)}
#marcas-admin .mk-save{background:#2a2e36;border:1px solid #33383f;color:#8a8f98;border-radius:999px;
  padding:12px 26px;font:600 14px Oswald,sans-serif;letter-spacing:1px;text-transform:uppercase;cursor:default}
#marcas-admin .mk-save.sujo{background:#F2C230;border-color:#F2C230;color:#15161a;cursor:pointer}
#marcas-admin .mk-save.sujo:hover{filter:brightness(1.08)}
#marcas-admin .mk-save[disabled]{opacity:.7;cursor:progress}
#marcas-admin .mk-savemsg{margin-top:8px;font-size:12.5px;min-height:16px}
#marcas-admin .mk-savemsg.ok{color:#6ede8a}
#marcas-admin .mk-savemsg.erro{color:#ff9c9c}
#marcas-admin .mk-nota{margin-top:8px;color:#7a808a;font-size:11.5px;line-height:1.5;max-width:720px}

@media(max-width:640px){
  #marcas-admin .mk-tab th:nth-child(2),#marcas-admin .mk-c-n{width:auto}
  #marcas-admin .mk-extra{display:none}
  #marcas-admin .mk-tab td,#marcas-admin .mk-tab th{padding:9px 10px}
  #marcas-admin .mk-nome{font-size:13.5px}
}
/* marca sem peças usa o MESMO interruptor amarelo das outras: ligada é ligada,
   e tem de se ver logo qual está ligada e qual não está. */

/* ===== bloco 65: o painel de admin nao leva o leitor de musica por cima ===
   No admin o player ficava pousado em cima da tabela e tapava os nomes das
   marcas. Fica so a pastilha MUSIC, que e pequena e nao esconde nada; quem
   quiser musica abre-a na mesma.
   ========================================================================= */
body[data-view="admin"] #capa .trax,
body[data-view="admin"] .trax{display:none !important}
body[data-view="admin"] .music-chip,
body[data-view="admin"] #capa .music-chip{display:flex !important;z-index:9 !important}
body[data-view="admin"] #tej-launch{display:none !important}
/* dois links lado a lado na mesma bolha (Akrapovič / Formula Z) */
#tej-msgs .tej-m.link{display:flex;flex-wrap:wrap;gap:7px}
#tej-msgs .tej-m .tk-it .tk-b a.tk-c{white-space:normal;text-align:left}
/* guardar o kit na lista: ao lado do botao do carrinho */
#tej-msgs .tej-m a.tk-guardar{display:inline-block;margin:6px 0 0 8px;text-decoration:none;cursor:pointer;
  font:600 13px Oswald,sans-serif;letter-spacing:.6px;text-transform:uppercase;
  padding:9px 16px;border-radius:999px;border:1px solid rgba(255,255,255,.22);
  color:#e8eaee;background:rgba(255,255,255,.05)}
#tej-msgs .tej-m a.tk-guardar:hover{border-color:rgba(242,194,48,.6);color:#F2C230}
#tej-msgs .tej-m a.tk-guardar.posto{border-color:rgba(76,201,110,.5);color:#6ede8a;background:rgba(76,201,110,.12)}
@media(max-width:480px){ #tej-msgs .tej-m a.tk-guardar{margin-left:0;margin-top:8px;display:block;text-align:center} }

    /* dinamometro: marca sem modelos listados — em vez de caixa vazia, diz o
       que se passa e da caminho. Nada desaparece do site por causa disto. */
    .dyno-nomodel{margin:10px 0 2px;padding:12px 14px;border:1px solid rgba(242,194,48,.35);
      border-radius:10px;background:rgba(242,194,48,.07);color:#e7dcc0;font-size:13.5px;line-height:1.55}
    .dyno-nomodel b{color:#f2c230}
    .dyno-nomodel .dnm-acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
    .dyno-nomodel button{background:#1a1b20;color:#e9eaee;border:1px solid var(--line);
      border-radius:8px;padding:8px 13px;font-size:12.5px;cursor:pointer;font-family:inherit}
    .dyno-nomodel button:hover{border-color:#f2c230;color:#f2c230}
    @media(max-width:520px){.dyno-nomodel .dnm-acts button{flex:1 1 100%}}

    /* ===== velocidade em maquinas mais fracas =====================
       O site tem ~18.000 elementos e ~4 MB de JavaScript por carregar. Num
       Mac com chip Apple isso passa despercebido; num Android ou num portatil
       Windows e o que faz o site travar, porque e trabalho de processador, nao
       de rede. content-visibility diz ao browser para NAO gastar tempo a
       calcular e pintar o que esta fora do ecra — o conteudo continua todo la,
       continua a ser filtrado, procurado e clicavel; so nao e desenhado antes
       de ser preciso. Onde o browser nao conhecer a propriedade, e ignorada:
       nada muda para quem ja tinha o site rapido.
       O contain-intrinsic-size e o tamanho reservado enquanto nao se pinta,
       para a barra de rolagem nao saltar (cartao real: 279x482).          */
    @supports (content-visibility: auto) {
      .prod-card{ content-visibility:auto; contain-intrinsic-size:auto 482px }
      .wsc-card, .wd2{ content-visibility:auto; contain-intrinsic-size:auto 320px }
      .mw-card{ content-visibility:auto; contain-intrinsic-size:auto 220px }
      .ex-card, .ak-card{ content-visibility:auto; contain-intrinsic-size:auto 200px }
      .news-card, .art-card{ content-visibility:auto; contain-intrinsic-size:auto 300px }
      /* a secção aberta nunca e saltada: so o que esta noutras secções */
      section.brand-page:not(.solo-active):not(.active){ content-visibility:auto }
    }
    /* isolar o desenho de cada cartao: uma mudanca num cartao deixa de obrigar
       o browser a recalcular a grelha toda */
    .prod-card{ contain:layout style }
    .wsc-card,.wd2,.mw-card{ contain:layout style }

    /* icones do player: agora sao SVG, precisam de ficar centrados na caixa */
    .mp-play{display:flex;align-items:center;justify-content:center;line-height:0}
    .mrow .star{display:flex;align-items:center;justify-content:center;line-height:0}
    .mp-empty svg{opacity:.9}
    .blp-ico-w{display:inline-flex;align-items:center;line-height:0}

/* ===== vídeos de produção (rodas e body kits) ===========================
   Horizontal nas rodas, vertical nos body kits. O cartão abre o leitor
   grande que o site já tem, com som. Em ecrã estreito não toca sozinho:
   fica a imagem e o botão, para não pesar no telemóvel.                 */
.prodvid{margin:30px 0 26px}
.pv-head{margin-bottom:14px}
.pv-t{font:700 clamp(17px,2.2vw,23px)/1.2 Oswald,sans-serif;letter-spacing:.6px;text-transform:uppercase;color:#fff}
.pv-t::after{content:"";display:block;width:52px;height:3px;background:var(--yellow,#F2C230);margin-top:8px;border-radius:2px}
.pv-s{margin-top:9px;color:#9aa0aa;font-size:14px;line-height:1.55;max-width:720px}
.pv-row{display:grid;gap:14px}
.prodvid[data-fmt="h"] .pv-row{grid-template-columns:repeat(3,1fr)}
.prodvid[data-fmt="v"] .pv-row{grid-template-columns:repeat(4,minmax(0,176px));justify-content:center}
.pv-i{position:relative;margin:0;border-radius:12px;overflow:hidden;background:#0b0b0d;border:1px solid rgba(255,255,255,.08);cursor:pointer;transition:border-color .2s,transform .2s}
.pv-i:hover{border-color:rgba(242,194,48,.55);transform:translateY(-2px)}
.prodvid[data-fmt="h"] .pv-i{aspect-ratio:16/9}
.prodvid[data-fmt="v"] .pv-i{aspect-ratio:9/16}
.pv-v{width:100%;height:100%;object-fit:cover;display:block;background:#0b0b0d}
.pv-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s;pointer-events:none}
.pv-play svg{width:58px;height:58px}
.pv-i:hover .pv-play{opacity:1}
.prodvid.sem-auto .pv-play{opacity:1}
.pv-i figcaption{position:absolute;left:0;right:0;bottom:0;padding:22px 12px 10px;font:600 12.5px Oswald,sans-serif;letter-spacing:.5px;text-transform:uppercase;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.82));pointer-events:none}
@media(max-width:900px){
  .prodvid[data-fmt="v"] .pv-row{grid-template-columns:repeat(2,minmax(0,200px))}
}
@media(max-width:620px){
  .prodvid[data-fmt="h"] .pv-row{grid-template-columns:1fr}
  .prodvid[data-fmt="v"] .pv-row{grid-template-columns:repeat(2,1fr);gap:10px}
  .pv-play svg{width:46px;height:46px}
}

/* ===== formas de pagamento, no rodapé e em todas as páginas ============ */
.blp-paybar{margin:18px auto 0;padding:16px 0 2px;max-width:1100px;text-align:center}
.site-footer .blp-paybar{grid-column:1 / -1;width:100%;border-top:1px solid rgba(201,165,59,.22)}
.blp-paybar .bp-t{font:500 11px Oswald,sans-serif;letter-spacing:1.5px;text-transform:uppercase;color:#8d929b;margin-bottom:10px}
.blp-paybar .bp-row{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-items:center}
.blp-paybar .bp-i{display:inline-flex;align-items:center;justify-content:center;background:#fff;border-radius:8px;width:56px;height:38px;box-shadow:0 1px 0 rgba(255,255,255,.08)}
.blp-paybar .bp-i img{width:50px;height:34px;display:block;object-fit:contain}
.blp-paybar .bp-n{margin-top:9px;color:#6f737b;font-size:11.5px;letter-spacing:.3px}
.blp-paybar.flutua{margin-top:34px;padding-bottom:22px;border-top:1px solid rgba(201,165,59,.18)}
#bpl-footer{display:none}
@media(max-width:620px){
  .blp-paybar .bp-i{width:50px;height:34px}
  .blp-paybar .bp-i img{width:44px;height:30px}
}

/* ===== frete estimado, no carrinho ===================================== */
.blp-frete{margin-top:10px;padding-top:10px;border-top:1px dashed rgba(255,255,255,.14)}
.blp-frete .bf-l{display:flex;justify-content:space-between;gap:12px;font-size:13px;color:#cfd3d9;margin:3px 0}
.blp-frete .bf-l b{color:#fff}
.blp-frete .bf-w{color:#9aa0aa;font-size:12px;line-height:1.5;margin-top:6px}
.blp-frete .bf-v{color:var(--yellow,#F2C230);font-weight:700}

/* ===== body kits · abas de vídeos (produção / carros de clientes) ====== */
.bk-media{margin:30px 0 26px}
.bkm-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.bkm-tab{background:transparent;border:1px solid rgba(255,255,255,.16);color:#cfd3d9;
  font:600 12.5px Oswald,sans-serif;letter-spacing:1px;text-transform:uppercase;
  padding:9px 18px;border-radius:999px;cursor:pointer;transition:all .18s}
.bkm-tab:hover{border-color:rgba(242,194,48,.5);color:#fff}
.bkm-tab.on{background:var(--yellow,#F2C230);border-color:var(--yellow,#F2C230);color:#0b0b0d}
.bkm-marcas{display:flex;gap:7px;flex-wrap:wrap;margin:0 0 14px}
.bkm-marca{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);color:#b8bcc4;
  font:500 11.5px Oswald,sans-serif;letter-spacing:.6px;padding:6px 13px;border-radius:999px;cursor:pointer;transition:all .18s}
.bkm-marca:hover{color:#fff;border-color:rgba(242,194,48,.45)}
.bkm-marca.on{background:rgba(242,194,48,.14);border-color:var(--yellow,#F2C230);color:var(--yellow,#F2C230)}
.bk-media .prodvid{margin:0}

/* ===== frete no checkout =============================================== */
.blp-co-frete{margin:14px 0 4px;padding:14px 16px;border:1px solid rgba(201,165,59,.28);
  border-radius:10px;background:rgba(242,194,48,.045)}
.blp-co-frete .cf-l{display:flex;justify-content:space-between;align-items:baseline;gap:12px;
  font-size:13.5px;color:#cfd3d9;margin:2px 0}
.blp-co-frete .cf-l b{color:#fff;font-size:14px}
.blp-co-frete .cf-v{color:var(--yellow,#F2C230);font-weight:700}
.blp-co-frete .cf-l.tot{margin-top:9px;padding-top:9px;border-top:1px solid rgba(255,255,255,.12);font-size:15px}
.blp-co-frete .cf-l.tot b{color:var(--yellow,#F2C230);font-size:17px;font-weight:700}
.blp-co-frete .cf-w{color:#9aa0aa;font-size:12px;line-height:1.5;margin-top:3px}

/* ===== carrossel que anda sozinho ======================================
   Uma fita contínua: as peças são duplicadas uma vez e a fita desliza
   metade da sua largura, em laço. É uma animação de transform, feita pelo
   compositor — não há JavaScript a correr quadro a quadro, por isso não
   pesa no telemóvel. Pára sozinha quando sai do ecrã, quando se passa o
   rato por cima, quando se toca, e para quem pediu menos movimento no
   sistema.                                                              */
.blq-on{
  display:block !important;
  overflow:hidden !important;
  flex-wrap:nowrap !important;
  width:100% !important;
  scroll-snap-type:none !important;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 5%,#000 95%,transparent 100%);
          mask-image:linear-gradient(90deg,transparent 0,#000 5%,#000 95%,transparent 100%);
}
.blq-on::-webkit-scrollbar{display:none}
.blq-track{
  display:flex !important;
  flex-wrap:nowrap !important;
  width:max-content;
  will-change:transform;
  -webkit-user-select:none;user-select:none;
  animation:blq-roll var(--blq-dur,46s) linear infinite;
}
/* Parada: a fita anda sozinha com animacao de CSS (nao gasta nada e nao
   depende de JavaScript a correr quadro a quadro). Mal se toca com o dedo
   ou com o rato, o JS assume a posicao, segue o gesto, e no fim devolve a
   animacao ao CSS exactamente onde ficou. */
@keyframes blq-roll{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(calc(var(--blq-meia,1000px) * -1),0,0)}
}
.blq-on:hover .blq-track,
.blq-on.blq-pause .blq-track{animation-play-state:paused}
.blq-on.blq-manual .blq-track{animation:none !important}
.blq-on{cursor:grab;touch-action:pan-y}
.blq-on.blq-drag{cursor:grabbing}
.blq-on.blq-drag .blq-track{pointer-events:none}
.blq-on .mw-crumb{display:none}
.blq-on img,.blq-on video{-webkit-user-drag:none;user-drag:none}
.blq-clone{pointer-events:auto}
@media (prefers-reduced-motion:reduce){ .blq-track{animation:none !important} }

/* vídeos de produção em fita, no telemóvel */
@media(max-width:820px){
  .prodvid .pv-head{text-align:center}
  .prodvid .pv-t::after{margin-left:auto;margin-right:auto}
  .prodvid .pv-s{margin-left:auto;margin-right:auto}
  .prodvid .pv-i figcaption{text-align:center}
  .prodvid[data-fmt="h"] .pv-row.blq-on .blq-track>.pv-i{width:78vw;max-width:360px}
  .prodvid[data-fmt="v"] .pv-row.blq-on .blq-track>.pv-i{width:46vw;max-width:220px}
  .pv-row.blq-on .blq-track>.pv-i{flex:0 0 auto}
}
.bkm-tabs{justify-content:flex-start}
@media(max-width:820px){ .bkm-tabs,.bkm-marcas{justify-content:center} }

/* a fita das marcas de carro vive dentro de um contentor que rola:
   quando passa a andar sozinha, o contentor deixa de precisar de rolar */
.veh-marquee:has(> .veh-mq-track.blq-on){overflow:hidden !important}
.veh-mq-track.blq-on,.zp-carousel.blq-on{max-width:100%}

/* ---- botao de play: um so desenho em todo o site -------------------------
   O Braga: "retira essa bolinha feia e poe um botao como o do YouTube".
   A bolinha azul era o caracter ▶ (no iPhone sai como emoji azul) dentro de
   um circulo com anel branco. Agora e sempre o mesmo SVG: disco escuro
   translucido, triangulo branco de pontas redondas, sem anel.            */
.pv-play svg, .vid-card .vc-play svg, .zp-play svg{
  filter:drop-shadow(0 3px 12px rgba(0,0,0,.65));
}


/* ===== ficha de produto: tirar o preto chapado =====
   As fotos do fabricante vem sobre fundo branco. Postas num quadro quase
   preto ficam a flutuar e parecem recortadas. O palco da foto passa a ser
   claro, como em qualquer loja a serio, e a coluna da direita passa a ser
   um cartao em vez de texto solto sobre o fundo. */
#bpv-ov{background:radial-gradient(1100px 680px at 50% -8%,#171b21 0%,rgba(23,27,33,0) 68%),#0c0e11 !important}
#bpv-ov .bpv-img{background:linear-gradient(180deg,#ffffff 0%,#ebedf0 100%) !important;
  border:1px solid rgba(0,0,0,.12) !important;box-sizing:border-box;padding:30px;
  box-shadow:0 18px 50px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.9) !important}
#bpv-ov .bpv-img .bpv-noimg{color:#c3c7cd !important}
#bpv-ov .bpv-grid>div:not(.bpv-img){background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.085);border-radius:16px;padding:26px 26px 28px;
  box-shadow:0 10px 36px rgba(0,0,0,.35)}
#bpv-ov .bpv-specs{background:rgba(0,0,0,.22)}
#bpv-ov .bpv-specs div:nth-child(odd){background:rgba(255,255,255,.022)}
#bpv-ov .bpv-add{box-shadow:0 8px 20px rgba(242,194,48,.22)}
#bpv-ov .bpv-wa{box-shadow:0 8px 20px rgba(37,211,102,.18)}
#bpv-ov .bpv-rc .i{background:linear-gradient(180deg,#ffffff,#edeff2) !important}
@media(max-width:820px){#bpv-ov .bpv-grid>div:not(.bpv-img){padding:18px 16px 20px}#bpv-ov .bpv-img{padding:16px}}

/* ======================================================================
   bloco 120 — topo e rodape (pedido do dono, 03/10)
   1) logo do ecra de carregamento mais pequeno
   2) idioma + moeda + bandeira centrados entre o logo e os botoes de compra,
      com espaco largo entre os tres
   3) rodape da capa: TEJ, musica e chat com mais respiro (a bandeira subiu)
   ====================================================================== */
#blp-logo-splash .bls-logo{width:min(46vw,318px) !important}
@media(max-width:720px){ #blp-logo-splash .bls-logo{width:min(62vw,250px) !important} }

@media(min-width:1025px){
  #blplang{gap:26px !important; align-items:center !important}
  /* (a bandeira passou a ser posicionada pelo bloco 127) */

  #tej-launch{left:18px !important; bottom:18px !important}
  #capa .music-chip{left:104px !important; bottom:18px !important; top:auto !important}
  body:has(#capa:not(.entered)) #blpchat-launch{
    left:266px !important; right:auto !important; bottom:18px !important;
  }
}

/* bloco 121 — banner estatico da Formula Z (fotograma do proprio video) */
.section-band video.band-still{width:100%;height:100%;object-fit:fill;display:block}
.section-band img.band-img{width:100%;height:100%;object-fit:fill;display:block}

/* ======================================================================
   bloco 122 — seccao TEJ PARKER (menu central -> cat-tej)
   ====================================================================== */
#cat-tej .section-band.tejp-band{
  display:flex; align-items:center; gap:26px; padding:0 clamp(20px,6vw,90px);
  background:radial-gradient(ellipse 70% 130% at 18% 50%,#1b1d23 0%,#0b0c0f 72%);
  overflow:hidden;
}
#cat-tej .section-band.tejp-band::after{display:none}
#cat-tej .tejp-face{
  width:118px; height:118px; flex:0 0 auto; border-radius:50%;
  object-fit:cover; object-position:50% 20%;
  border:2px solid rgba(242,194,48,.65); box-shadow:0 14px 38px rgba(0,0,0,.6);
}
#cat-tej .tejp-band-tx{display:flex; flex-direction:column; gap:6px; min-width:0}
#cat-tej .tejp-band-tx b{
  font-family:'Oswald',sans-serif; font-weight:700; font-size:clamp(26px,4.2vw,44px);
  letter-spacing:.06em; color:#fff; line-height:1;
}
#cat-tej .tejp-band-tx span{
  font-family:'Oswald',sans-serif; font-size:clamp(10px,1.5vw,13px);
  letter-spacing:.26em; text-transform:uppercase; color:rgba(242,194,48,.92);
}
#cat-tej .tejp-acts{display:flex; flex-wrap:wrap; gap:14px; margin:22px 0 34px}
#cat-tej .tejp-btn{
  display:inline-flex; align-items:center; gap:10px;
  font-family:'Oswald',sans-serif; font-weight:600; font-size:14px; letter-spacing:.08em;
  text-transform:uppercase; padding:14px 26px; border-radius:30px; cursor:pointer;
  border:1px solid rgba(242,194,48,.55); background:#F2C230; color:#101114;
  box-shadow:0 10px 28px rgba(242,194,48,.18); transition:transform .12s ease, box-shadow .2s ease;
}
#cat-tej .tejp-btn:hover{transform:translateY(-2px); box-shadow:0 14px 34px rgba(242,194,48,.3)}
#cat-tej .tejp-btn.ghost{background:transparent; color:#F2C230; box-shadow:none}
#cat-tej .tejp-btn.ghost:hover{background:rgba(242,194,48,.1)}

#cat-tej .tejp-grid{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(282px,1fr));
  gap:16px; margin:14px 0 30px;
}
#cat-tej .tejp-card{
  background:linear-gradient(180deg,#14161b,#101115);
  border:1px solid #23262d; border-radius:16px; padding:20px 20px 16px;
  display:flex; flex-direction:column; gap:9px;
  transition:border-color .18s ease, transform .18s ease;
}
#cat-tej .tejp-card:hover{border-color:rgba(242,194,48,.5); transform:translateY(-3px)}
#cat-tej .tejp-card h4{
  margin:0; font-family:'Oswald',sans-serif; font-weight:600; font-size:16px;
  letter-spacing:.04em; color:#fff;
}
#cat-tej .tejp-card p{margin:0; font-size:13px; line-height:1.5; color:#9aa0aa; flex:1 1 auto}
#cat-tej .tejp-dl{display:flex; gap:9px; margin-top:6px}
#cat-tej .tejp-dl a{
  flex:1 1 0; text-align:center; text-decoration:none;
  font-family:'Oswald',sans-serif; font-size:12px; font-weight:600; letter-spacing:.12em;
  padding:9px 0; border-radius:9px; border:1px solid #2f333c; color:#d7dae0;
  transition:.15s ease;
}
#cat-tej .tejp-dl a:hover{border-color:#F2C230; color:#F2C230; background:rgba(242,194,48,.08)}
#cat-tej .tejp-rule{
  border-left:3px solid #F2C230; background:rgba(242,194,48,.06);
  padding:14px 18px; border-radius:0 12px 12px 0; margin:6px 0 26px;
  font-size:13.5px; line-height:1.6; color:#d2d6dd;
}
@media(max-width:720px){
  #cat-tej .section-band.tejp-band{gap:16px; padding:0 18px}
  #cat-tej .tejp-face{width:76px; height:76px}
  #cat-tej .tejp-btn{font-size:12.5px; padding:12px 18px}
}

/* bloco 123 — legenda dos tres chips do topo (envio / moeda / idioma) */
@media(min-width:1025px){
  #blplang{align-items:center !important}
  #blplang #blpmkt, #blplang #blpcur{position:relative}
  #blplang.cap-on [data-cap]::after{
    content:attr(data-cap);
    position:absolute; top:calc(100% + 6px); left:50%; transform:translateX(-50%);
    font-family:'Oswald',sans-serif; font-weight:500;
    font-size:8px; letter-spacing:.2em; text-transform:uppercase;
    color:rgba(255,255,255,.44); white-space:nowrap; pointer-events:none;
    text-shadow:0 1px 4px rgba(0,0,0,.85);
  }
  #blplang.cap-on [data-cap]:hover::after{color:rgba(242,194,48,.9)}
}

/* bloco 124 — caixa de perguntas do assistente Tej */
#cat-tej .tejp-ask{
  display:flex; gap:10px; align-items:stretch; margin:20px 0 4px;
  max-width:720px;
}
#cat-tej .tejp-ask input{
  flex:1 1 auto; min-width:0;
  background:#101217; border:1px solid #272b33; border-radius:30px;
  padding:14px 20px; color:#e8eaee; font-family:'Oswald',sans-serif;
  font-size:14px; letter-spacing:.02em; outline:none;
  transition:border-color .15s ease;
}
#cat-tej .tejp-ask input::placeholder{color:#6b7179}
#cat-tej .tejp-ask input:focus{border-color:rgba(242,194,48,.6)}
#cat-tej .tejp-ask button{
  flex:0 0 auto; cursor:pointer; border:none; border-radius:30px;
  background:#F2C230; color:#101114; padding:0 26px;
  font-family:'Oswald',sans-serif; font-weight:600; font-size:13px;
  letter-spacing:.12em; text-transform:uppercase;
  transition:transform .12s ease;
}
#cat-tej .tejp-ask button:hover{transform:translateY(-1px)}
#cat-tej .tejp-hint{font-size:12px; color:#6b7179; margin:0 0 22px}
@media(max-width:720px){
  #cat-tej .tejp-ask{flex-direction:column}
  #cat-tej .tejp-ask button{padding:13px 0}
}

/* ======================================================================
   bloco 125 — mapa (pedido do dono)
   barras de camadas e de accoes saem de cima do mapa: uma fica acima,
   outra abaixo, e o mapa fica centrado entre as duas. Sem a notificacao
   de radar de demonstracao a abrir sozinha.
   ====================================================================== */
#blmap-host .blmap-grid{
  height:calc(100vh - 150px) !important; min-height:600px !important; max-height:920px !important;
  padding:54px 0 62px !important;
  overflow:visible !important;
  border:0 !important; background:transparent !important; border-radius:0 !important;
}
#blmap-host .blmap-center{ inset:54px 0 62px !important; }
#blmap-host .blmap-map{
  border-radius:14px !important; overflow:hidden !important;
  border:1px solid rgba(255,255,255,.09) !important;
}
#blmap-host .blmap-layers{ top:-50px !important; bottom:auto !important; }
#blmap-host .blmap-acts{ bottom:-58px !important; top:auto !important; }
#blmap-host .blmap-side, #blmap-host .blmap-chat{
  top:54px !important; bottom:62px !important; border-radius:14px !important;
}
#blmap-host .blm-tog.l, #blmap-host .blm-tog.r{ top:66px !important; }
#blmap-host .blmap-grid .blmap-alert{ display:none !important; }
#blmap-host .blmap-acts .a-tej{ display:none !important; }
@media(max-width:1024px){
  #blmap-host .blmap-grid{ padding:48px 0 58px !important; height:calc(100vh - 130px) !important; min-height:520px !important; }
  #blmap-host .blmap-center{ inset:48px 0 58px !important; }
  #blmap-host .blmap-layers{ top:-44px !important; left:50% !important; right:auto !important; bottom:auto !important; }
  #blmap-host .blmap-acts{ bottom:-54px !important; }
  #blmap-host .blmap-side, #blmap-host .blmap-chat{ top:48px !important; bottom:58px !important; }
  #blmap-host .blm-tog.l, #blmap-host .blm-tog.r{ top:58px !important; }
}

/* bloco 125b — acertos do mapa: gavetas totalmente fora e barra de baixo a caber no ecra */
#blmap-host .blmap-grid{ height:calc(100vh - 230px) !important; min-height:430px !important; max-height:760px !important; }
#blmap-host .blmap-side{ transform:translateX(calc(-100% - 60px)) !important; }
#blmap-host .blmap-chat{ transform:translateX(calc(100% + 60px)) !important; }
#blmap-host .blmap-grid.side-on .blmap-side{ transform:none !important; }
#blmap-host .blmap-grid.chat-on .blmap-chat{ transform:none !important; }
@media(max-width:1024px){
  #blmap-host .blmap-grid{ height:calc(100vh - 200px) !important; min-height:380px !important; }
}

/* bloco 125c — o painel de rota/locais so aparece quando e aberto */
#blmap-host .mpp-sheet{ visibility:hidden; }
#blmap-host .blmap-grid.sheet-on .mpp-sheet{ visibility:visible; }

/* ======================================================================
   bloco 126 — bandeira do idioma sem piscar + rodape da capa arrumado
   ====================================================================== */
/* em ecra grande a bandeira so se mostra depois de colocada no topo:
   assim nunca chega a aparecer um instante no rodape */


/* rodape da capa: TEJ, musica e chat na mesma linha, mesma altura,
   com o mesmo respiro entre eles */
@media(min-width:1025px){
  #tej-launch{
    left:18px !important; bottom:20px !important;
    width:46px !important; height:46px !important;
  }
  #capa .music-chip{
    left:80px !important; bottom:20px !important; top:auto !important;
    height:46px !important; box-sizing:border-box !important;
    padding:0 18px 0 14px !important; gap:10px !important;
    border-radius:26px !important;
  }
  body:has(#capa:not(.entered)) #blpchat-launch{
    left:200px !important; right:auto !important; bottom:20px !important;
    height:46px !important; box-sizing:border-box !important;
    padding:0 20px !important; border-radius:26px !important;
  }
}


/* ======================================================================
   bloco 127 — botao de idioma dentro do bloco do topo
   Em ecra grande a bandeira flutuante desaparece e quem aparece e o botao
   que vive dentro de #blplang: fica na linha por layout, nao por
   coordenadas, por isso nao pode piscar nem cair para o rodape.
   ====================================================================== */
@media(min-width:1025px){
  #blp-lang-chip{display:none !important}
  #blplang .blp-lang-top{
    position:relative;
    display:flex !important; align-items:center; justify-content:center;
    flex:0 0 auto;
    width:40px; height:40px; padding:0 !important;
    border-radius:50%; border:1px solid #2a2e36;
    background:rgba(0,0,0,.78); cursor:pointer;
    transition:transform .12s ease, border-color .15s ease;
  }
  #blplang .blp-lang-top:hover{border-color:#F2C230}
  #blplang .blp-lang-top:active{transform:scale(.93)}
  #blplang .blp-lang-top .lg-flag{font-size:19px; line-height:1}
}
@media(max-width:1024px){
  #blplang .blp-lang-top{display:none !important}
}

/* ======================================================================
   bloco 128 — carrossel de marcas: parar com o rato em cima
   A fita andava sempre. Entre o botao descer e subir, o cartao mudava de
   sitio e o browser entregava o clique ao contentor em vez do link: as
   paginas de marca nunca abriam. Com o rato em cima, a fita para.
   ====================================================================== */
.mw-list.blq-on:hover > .blq-track,
.mw-list.blq-on:focus-within > .blq-track{
  animation-play-state:paused !important;
}

/* bloco 128b — a mesma pausa nos carrosseis de veiculos e do Z-Pipe */
.veh-mq-track.blq-on:hover > .blq-track,
.veh-mq-track.blq-on:focus-within > .blq-track,
.zp-carousel.blq-on:hover > .blq-track,
.zp-carousel.blq-on:focus-within > .blq-track{
  animation-play-state:paused !important;
}

/* ===== body kits · carros acabados (fotografias) ========================
   bloco 129. A aba da produçao sao videos em pe; esta e de fotografias
   deitadas (1200x750), por isso tem grelha e proporçao proprias. A grelha
   enche-se sozinha conforme a largura — com 116 fotografias, e mais tarde
   com as que vierem, nao ha numero de colunas fixo que sirva.
   O cartao carrega a miniatura; a fotografia grande so e pedida quando
   se clica.                                                             */
.prodvid[data-fmt="f"] .pv-row{grid-template-columns:repeat(auto-fill,minmax(212px,1fr));gap:12px}
.prodvid[data-fmt="f"] .pv-i{aspect-ratio:16/10}
.pv-i.pv-foto{cursor:zoom-in}
.pv-i.pv-foto img.pv-v{transition:transform .35s ease}
.pv-i.pv-foto:hover img.pv-v{transform:scale(1.045)}
.pv-i.pv-foto figcaption{padding:26px 10px 8px;font-size:11px;opacity:.92}
.bkm-marca i{font-style:normal;opacity:.55;font-size:10.5px;margin-left:3px}
.bkm-mais{display:flex;justify-content:center;margin:16px 0 2px}
.bkm-mais button{background:transparent;border:1px solid rgba(255,255,255,.18);color:#cfd3d9;
  font:600 12px Oswald,sans-serif;letter-spacing:1px;text-transform:uppercase;
  padding:10px 26px;border-radius:999px;cursor:pointer;transition:all .18s}
.bkm-mais button:hover{border-color:var(--yellow,#F2C230);color:var(--yellow,#F2C230)}
/* tablet: quatro a largo */
@media(min-width:621px) and (max-width:1024px){
  .prodvid[data-fmt="f"] .pv-row{grid-template-columns:repeat(4,1fr);gap:8px}
  .prodvid[data-fmt="f"] .pv-i figcaption{font-size:10px;padding:18px 7px 6px}
}
/* telemovel: tres colunas, cartao pequeno — ve-se doze de uma vez e
   puxa-se mais se interessar, em vez de uma fotografia gigante por ecra */
@media(max-width:620px){
  .prodvid[data-fmt="f"] .pv-row{grid-template-columns:repeat(3,1fr);gap:5px}
  .prodvid[data-fmt="f"] .pv-i{aspect-ratio:4/3;border-radius:7px}
  .prodvid[data-fmt="f"] .pv-i figcaption{font-size:8.5px;letter-spacing:.2px;padding:14px 4px 4px;line-height:1.1}
  .bk-media .bkm-mais{margin:12px 0 2px}
  .bk-media .bkm-mais button{padding:9px 22px;font-size:11.5px}
}
/* se o ficheiro de estilo chegar velho a algum aparelho, a grelha nao fica
   com uma fotografia por linha: isto vale mesmo sem o data-fmt */
.bk-media .pv-row{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}

/* ===== body kits · bloco das abas ao centro ============================
   bloco 130. Nos body kits este bloco e o unico a toda a largura, e
   encostado a esquerda ficava a puxar o olho para o canto. Centra-se
   tudo: abas, titulo, risco amarelo e a linha de baixo.
   So aqui — nas rodas o bloco continua encostado, que ali ha texto ao
   lado.                                                                 */
.bk-media .bkm-tabs{justify-content:center}
.bk-media .bkm-marcas{justify-content:center}
.bk-media .prodvid .pv-head{text-align:center}
.bk-media .prodvid .pv-t::after{margin-left:auto;margin-right:auto}
.bk-media .prodvid .pv-s{margin-left:auto;margin-right:auto}

/* a barra das formas de pagamento passou a pendurar-se na propria
   secçao, fora do corpo com margens — por isso trata ela da folga */
section.brand-page > .blp-paybar.flutua,
section.section > .blp-paybar.flutua{width:min(1100px,100% - 32px);margin-left:auto;margin-right:auto}

/* ===== galeria das fotografias dos carros (body kits) ==================
   bloco 131. Fundo quase opaco para a fotografia ficar sozinha, setas
   nos cantos no computador e nada delas no telemovel. A fotografia nunca
   passa dos 84% da altura do ecra, para a legenda e o X caberem sempre.
   A camada tem de ficar acima do cabecalho (.hdr-actions esta nos 10002):
   com 9400 o X da galeria ficava escondido por tras do botao do carrinho. */
.bkfoto{position:fixed;inset:0;z-index:10200;display:none;background:rgba(6,6,8,.955);
  -webkit-user-select:none;user-select:none;touch-action:pan-y}
.bkfoto.on{display:flex;flex-direction:column;align-items:center;justify-content:center;
  animation:bkfIn .16s ease}
@keyframes bkfIn{from{opacity:0}to{opacity:1}}
.bkf-palco{flex:1 1 auto;width:100%;display:flex;align-items:center;justify-content:center;
  padding:58px 18px 6px;min-height:0;touch-action:pan-y}
.bkf-img{max-width:min(1180px,94vw);max-height:84vh;width:auto;height:auto;display:block;
  border-radius:10px;background:#0b0b0d;box-shadow:0 18px 60px rgba(0,0,0,.6);
  transition:transform .2s ease,opacity .2s ease;cursor:pointer}
.bkf-leg{flex:0 0 auto;padding:12px 16px 20px;text-align:center;
  font:600 12.5px Oswald,sans-serif;letter-spacing:1.4px;text-transform:uppercase;color:#e7e9ec}
.bkf-leg i{font-style:normal;color:#8d929b;letter-spacing:1px;margin-left:12px;font-size:11.5px}
.bkf-x{position:absolute;top:16px;right:18px;z-index:3;width:42px;height:42px;border-radius:50%;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);color:#fff;
  font-size:24px;line-height:1;cursor:pointer;transition:all .18s}
.bkf-x:hover{background:var(--yellow,#F2C230);border-color:var(--yellow,#F2C230);color:#0b0b0d}
.bkf-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:52px;height:52px;border-radius:50%;background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.16);color:#fff;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:all .18s}
.bkf-nav svg{width:24px;height:24px}
.bkf-nav:hover{background:var(--yellow,#F2C230);border-color:var(--yellow,#F2C230);color:#0b0b0d}
.bkf-ant{left:18px}
.bkf-seg{right:18px}
/* no telemovel manda o dedo: arrastar para o lado, ou tocar numa metade */
.bkfoto.bkf-toque .bkf-nav{display:none !important}
.bkfoto.bkf-toque .bkf-palco{padding:52px 8px 4px}
.bkfoto.bkf-toque .bkf-img{max-width:98vw;max-height:80vh;border-radius:8px}
@media(max-width:620px){
  .bkf-x{top:10px;right:10px;width:38px;height:38px;font-size:21px}
  .bkf-leg{font-size:11.5px;padding:10px 12px 16px}
  .bkf-leg i{display:block;margin:4px 0 0}
}

/* ===== admin · barra de publicar as seccoes ============================
   bloco 133. O painel das seccoes guardava so no navegador de quem mexia.
   Esta barra diz o que falta publicar e publica — fica colada ao topo do
   painel para nao se perder ao rolar a lista.                            */
.sec-pub{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  margin:0 0 16px;padding:13px 16px;border-radius:12px;
  background:rgba(46,199,122,.08);border:1px solid rgba(46,199,122,.34)}
.sec-pub.sujo{background:rgba(230,164,23,.10);border-color:rgba(230,164,23,.45)}
.sec-pub.aconferir{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.14)}
.sec-pub.aconferir .sec-pub-l b{color:#9aa0aa}
.sec-pub-l{flex:1 1 260px;min-width:0}
.sec-pub-l b{display:block;font:600 13px Oswald,sans-serif;letter-spacing:.6px;color:#2ec77a}
.sec-pub.sujo .sec-pub-l b{color:#e6a417}
.sec-pub-l i{display:block;margin-top:3px;font-style:normal;font-size:12px;color:#9aa0aa;line-height:1.45}
.sec-pub-b{flex:0 0 auto;background:#2ec77a;color:#04220f;border:0;border-radius:10px;
  font:700 12.5px Oswald,sans-serif;letter-spacing:.8px;text-transform:uppercase;
  padding:11px 20px;cursor:pointer;transition:filter .18s,opacity .18s}
.sec-pub.sujo .sec-pub-b{background:#e6a417;color:#231703}
.sec-pub-b:hover{filter:brightness(1.08)}
.sec-pub-b:disabled{opacity:.6;cursor:default}
@media(max-width:620px){ .sec-pub{padding:12px 13px} .sec-pub-b{width:100%} }

/* ===== 134 — quadro de apresentacao das fotos (telemovel e tablet) =====
   Uma moldura com 4 fileiras de fotos pequenas. Passa-se para o lado com
   o dedo, pagina a pagina; a pega de baixo, com a seta que bate, abre o
   quadro e mostra tudo.                                                */
.bkq{position:relative;margin:0;padding:9px 5px 38px;border:1px solid rgba(255,255,255,.11);
  border-radius:15px;background:rgba(255,255,255,.025);
  box-shadow:inset 0 -30px 36px -30px rgba(0,0,0,.9)}
.bkq-tira{display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;
  scroll-behavior:smooth;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;
  scrollbar-width:none;-ms-overflow-style:none;gap:0}
.bkq-tira::-webkit-scrollbar{display:none;width:0;height:0}
.bkq-pag{flex:0 0 100%;width:100%;scroll-snap-align:start;scroll-snap-stop:always}
.bkq-pag,.bkq-grelha{box-sizing:border-box;padding:0 4px;
  display:grid;grid-template-columns:repeat(3,1fr);gap:5px;align-content:start}
.bkq-pag .pv-i,.bkq-grelha .pv-i{aspect-ratio:4/3;border-radius:7px;margin:0}
.bkq-pag .pv-i:hover,.bkq-grelha .pv-i:hover{transform:none}
.bkq-pag .pv-i figcaption,.bkq-grelha .pv-i figcaption{padding:14px 5px 4px;font-size:8.5px;letter-spacing:.3px}

/* a pega */
.bkq-puxa{position:absolute;left:50%;bottom:7px;transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:4px;
  background:none;border:0;padding:5px 26px;cursor:pointer;touch-action:none;
  -webkit-tap-highlight-color:transparent}
.bkq-barra{display:block;width:36px;height:3px;border-radius:2px;background:rgba(255,255,255,.26)}
.bkq-seta{display:block;width:17px;height:10px;fill:none;stroke:var(--yellow,#F2C230);
  stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;
  animation:bkqbate 1.9s ease-in-out infinite}
@keyframes bkqbate{0%,100%{transform:translateY(-2px);opacity:.5}50%{transform:translateY(3px);opacity:1}}
.bkq-aberto .bkq-seta{animation:none;transform:rotate(180deg);opacity:.9}
.bkq-aberto{padding-bottom:42px}
@media(prefers-reduced-motion:reduce){ .bkq-seta{animation:none} }

/* as bolinhas das paginas */
.bkq-dots{display:flex;gap:6px;justify-content:center;align-items:center;margin:11px 0 2px}
.bkq-dots i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.22);
  cursor:pointer;transition:width .18s,background .18s;flex:0 0 auto;
  box-sizing:content-box;padding:8px 4px;background-clip:content-box}
.bkq-dots i.on{width:17px;border-radius:3px;background:var(--yellow,#F2C230)}
.bkq-dots.bkq-n{font:600 11px Oswald,sans-serif;letter-spacing:1.4px;color:rgba(255,255,255,.5)}
.bkq-dots.bkq-n b{color:var(--yellow,#F2C230)}

@media(min-width:621px) and (max-width:1024px){
  .bkq{padding:11px 7px 40px;border-radius:17px}
  .bkq-pag,.bkq-grelha{grid-template-columns:repeat(4,1fr);gap:8px}
  .bkq-pag .pv-i,.bkq-grelha .pv-i{aspect-ratio:16/10;border-radius:9px}
  .bkq-pag .pv-i figcaption,.bkq-grelha .pv-i figcaption{font-size:10px;padding:16px 7px 6px}
}

/* nota de proveniencia das fotos, antes do quadro.
   No computador ocupa a largura toda; no telemovel e tablet fica ao
   centro e com letra mais pequena.                                  */
.bkm-nota{max-width:none;width:100%;box-sizing:border-box;margin:0 0 20px;padding:15px 20px;
  border-left:3px solid var(--yellow,#F2C230);border-radius:0 11px 11px 0;
  background:rgba(242,194,48,.06);color:rgba(255,255,255,.80);
  font-size:16px;line-height:1.68;letter-spacing:.1px;text-align:left}
@media(min-width:621px) and (max-width:1024px){
  .bkm-nota{text-align:center;font-size:12.5px;line-height:1.6;
    padding:12px 16px;margin-bottom:16px;
    border-left:0;border-top:2px solid rgba(242,194,48,.75);border-radius:0 0 11px 11px}
}
@media(max-width:620px){
  .bkm-nota{text-align:center;font-size:11px;line-height:1.55;
    padding:10px 12px;margin-bottom:13px;
    border-left:0;border-top:2px solid rgba(242,194,48,.75);border-radius:0 0 9px 9px}
}

/* ===== 135 — chat no header (computador) =====
   Tem de ser #blpchat-launch e nao .chat-hdr: a regra original do botao
   verde e por ID e ganhava a todas as minhas. */
/* Os deslocamentos tem de ser ZERO explicito, nao "auto": o botao herdava o
   right/bottom da regra antiga do botao verde flutuante e saia da barra —
   aparecia 100px a direita do sino e 20px acima, fora do ecra. */
#blpchat-launch.chat-hdr{position:relative !important;top:0 !important;left:0 !important;
  right:auto !important;bottom:auto !important;inset-block-end:auto !important;
  inset-inline-end:auto !important;transform:none !important;
  width:44px !important;height:44px !important;flex:none;padding:0 !important;gap:0 !important;
  border-radius:12px !important;background:rgba(0,0,0,.55) !important;
  border:1px solid rgba(255,255,255,.14) !important;color:#2ec77a !important;
  box-shadow:none !important;font-size:0 !important;overflow:visible;
  display:flex !important;align-items:center;justify-content:center;transition:.15s}
#blpchat-launch.chat-hdr:hover{border-color:#2ec77a !important;background:rgba(46,199,122,.13) !important;color:#39e089 !important}
#blpchat-launch.chat-hdr > span{display:none !important}
#blpchat-launch.chat-hdr .chat-ic{display:block !important;width:21px !important;height:21px !important;
  fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#blpchat-launch.chat-hdr > b{position:absolute;top:-6px;right:-6px;min-width:19px;height:19px;
  padding:0 5px;background:var(--red,#d21f1f);color:#fff;border-radius:999px;
  font-family:'Oswald',sans-serif;font-size:11px;font-weight:700;
  align-items:center;justify-content:center;box-shadow:0 2px 8px -1px rgba(210,31,31,.7)}
/* a janela do chat tem de ficar por cima de tudo o que flutua */
#blpchat{z-index:10100 !important}

/* ===== 136 — telemovel: o chat e a musica vivem no menu lateral ===== */
#blpchat-launch.chat-no-menu{display:none !important}
.mob-drawer-item.mob-extra svg{width:20px;height:20px;flex:none}

/* ===== 137 — cabecalho da marca escolhida nos body kits ===== */
.bk-mkh{max-width:1200px;margin:26px auto 4px;padding:18px 22px;
  border:1px solid rgba(255,255,255,.1);border-left:3px solid var(--yellow,#F2C230);
  border-radius:0 14px 14px 0;background:rgba(242,194,48,.05);position:relative}
.bk-mkh-t{font-family:'Racing Sans One',sans-serif;font-size:27px;color:#fff;letter-spacing:.5px;text-transform:uppercase}
.bk-mkh-t i{font-style:normal;color:var(--yellow,#F2C230)}
.bk-mkh-s{margin-top:7px;color:rgba(255,255,255,.62);font-size:13.5px;line-height:1.55;max-width:760px}
.bk-mkh-x{position:absolute;right:18px;top:18px;background:rgba(0,0,0,.5);
  border:1px solid rgba(255,255,255,.18);border-radius:999px;color:#fff;
  font-family:'Oswald',sans-serif;font-size:12px;letter-spacing:.6px;text-transform:uppercase;
  padding:8px 15px;cursor:pointer;transition:.15s}
.bk-mkh-x:hover{border-color:var(--yellow,#F2C230);color:var(--yellow,#F2C230)}
@media(max-width:620px){
  .bk-mkh{margin:18px 0 4px;padding:14px 15px;border-radius:0 11px 11px 0}
  .bk-mkh-t{font-size:20px}
  .bk-mkh-s{font-size:12px;margin-top:5px}
  .bk-mkh-x{position:static;display:block;margin-top:11px;width:100%;padding:9px}
}

/* ===== 138 — telemovel/tablet ao alto: o botao amarelo nao existe =====
   Estava a ser escondido por JS e piscava a cada redesenho. Em CSS some de
   uma vez. */
@media(max-width:1024px){
  #blp-fab, #blp-fab-menu, #blp-fab-bd{display:none !important}
}

/* ===== 139 — fora o aviso de rodar o telemovel =====
   No telemovel o video de entrada nem corre, por isso pedir para virar o
   aparelho nao servia de nada. */
#blp-intro .intro-rotate{display:none !important}

/* ===== 140 — faixa de fundo do topo (computador, tablet e telemovel) ===== */
#blp-hdr-band{position:fixed;left:0;right:0;top:0;height:78px;z-index:10000;
  display:none;pointer-events:none;
  background:linear-gradient(180deg,rgba(7,7,9,.97) 0%,rgba(7,7,9,.95) 58%,rgba(7,7,9,.78) 82%,rgba(7,7,9,0) 100%);
  -webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}
#blp-hdr-band.on{display:block}

/* ===== 141 — carrinho rapido no telemovel: estava a sair do ecra =====
   Estava ancorado ao icone do carrinho (right:0) e, com 380px de largura
   num ecra de 390px, o lado esquerdo ficava cortado. Agora ocupa a largura
   toda com margem dos dois lados. */
@media(max-width:760px){
  .cart-mini{position:fixed !important;left:10px !important;right:10px !important;
    top:calc(74px + env(safe-area-inset-top)) !important;
    width:auto !important;max-width:none !important;
    max-height:calc(100vh - 120px);display:flex;flex-direction:column}
  .cart-mini-body{max-height:46vh}
  .cart-mini-foot{flex:none}
}

/* ===== 142 — a faixa de topo das seccoes nunca fica preta =====
   Enquanto o video nao chega, mostra-se a imagem da garagem em vez de um
   rectangulo preto. Assim que o video toca, ele tapa-a. */
.section-band{background-color:#0a0a0b;background-image:url('garage_bg.jpg');
  background-size:cover;background-position:center;background-repeat:no-repeat}
.section-band video{position:relative;z-index:1}

/* a barra do topo nunca empurra nada para fora do ecra */
.hdr-actions{max-width:calc(100vw - 30px);flex-wrap:nowrap}
#blpchat-launch.chat-hdr{flex:0 0 44px}

/* ===================== MEUS ARQUIVOS (bloco 145) =====================
   O Braga (09/10/2026) queria uma area so dele para as imagens do Instagram,
   com pastas e subpastas por tema. Aproveitei para subir os degraus de
   superficie: o fundo continua preto, mas os cartoes e os botoes levantam-se
   dele, que era a queixa do "muita coisa preta". */
#media-admin .mq-wrap{display:grid;grid-template-columns:268px 1fr;gap:18px;align-items:start}
@media(max-width:900px){#media-admin .mq-wrap{grid-template-columns:1fr}}

#media-admin .mq-lado{background:#16181c;border:1px solid #363b42;border-radius:14px;padding:12px;position:sticky;top:12px}
#media-admin .mq-lado-h{color:#a8b0ba;font-size:11px;text-transform:uppercase;letter-spacing:1.4px;margin:2px 0 10px;font-weight:600}
#media-admin .mq-ramo{display:block}
#media-admin .mq-filhas{display:block}
#media-admin .mq-past{display:flex;align-items:center;gap:7px;padding:8px 10px;border-radius:9px;cursor:pointer;
  color:#dfe3e9;font-family:'Oswald',sans-serif;font-size:13.5px;transition:background .13s,color .13s;border:1px solid transparent}
#media-admin .mq-past:hover{background:#22262c;color:#fff}
#media-admin .mq-past.on{background:rgba(242,194,48,.16);border-color:#F2C230;color:#fff;font-weight:600}
#media-admin .mq-seta{width:12px;flex:0 0 12px;text-align:center;color:#a8b0ba;font-size:11px}
#media-admin .mq-seta.vazia{visibility:hidden}
#media-admin .mq-ico{flex:0 0 auto;font-size:14px;line-height:1}
#media-admin .mq-nome{flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#media-admin .mq-cont{flex:0 0 auto;background:#2f343b;color:#c9cfd7;border-radius:10px;padding:1px 8px;font-size:11px}
#media-admin .mq-past.on .mq-cont{background:rgba(0,0,0,.4);color:#fff}
#media-admin .mq-nova{display:block;width:100%;margin-top:10px;background:#22262c;border:1px dashed #4a515a;color:#dfe3e9;
  border-radius:10px;padding:10px;font-family:'Oswald',sans-serif;font-size:13px;cursor:pointer;transition:.14s}
#media-admin .mq-nova:hover{border-color:#F2C230;color:#F2C230;background:#272c33}
#media-admin .mq-dica{margin-top:12px;color:#a8b0ba;font-size:11.5px;line-height:1.65;border-top:1px solid #2f343b;padding-top:10px}
#media-admin .mq-dica b{color:#dfe3e9}

#media-admin .mq-main{min-width:0}
#media-admin .mq-migalhas{display:flex;align-items:center;flex-wrap:wrap;gap:3px;margin-bottom:12px}
#media-admin .mq-mig{background:transparent;border:none;color:#a8b0ba;font-family:'Oswald',sans-serif;font-size:14px;
  cursor:pointer;padding:5px 8px;border-radius:7px}
#media-admin .mq-mig:hover{background:#22262c;color:#fff}
#media-admin .mq-mig.on{color:#F2C230;font-weight:600}
#media-admin .mq-sep{color:#5b636d;font-size:15px}

#media-admin .mq-barra{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:14px}
#media-admin .mq-btn{display:inline-flex;align-items:center;gap:6px;background:#22262c;border:1px solid #454c55;color:#e8ebef;
  border-radius:9px;padding:9px 15px;font-family:'Oswald',sans-serif;font-size:13px;cursor:pointer;transition:.14s;white-space:nowrap}
#media-admin .mq-btn:hover{background:#2c313a;border-color:#6a727d}
#media-admin .mq-btn.forte{background:#F2C230;border-color:#F2C230;color:#15130a;font-weight:600}
#media-admin .mq-btn.forte:hover{background:#ffd34d;border-color:#ffd34d}
#media-admin .mq-btn.mau{background:rgba(210,31,31,.16);border-color:rgba(210,31,31,.55);color:#ff8585}
#media-admin .mq-btn.mau:hover{background:rgba(210,31,31,.28);color:#ffb3b3}
#media-admin .mq-btn.feito{background:rgba(46,199,122,.16);border-color:rgba(46,199,122,.55);color:#5fe3a3}
#media-admin .mq-msg{font-size:12.5px;font-family:'Oswald',sans-serif;margin-left:4px}

#media-admin .mq-busca{width:100%;background:#13151a;border:1px solid #454c55;border-radius:9px;color:#fff;
  font-family:'Oswald',sans-serif;font-size:13.5px;padding:10px 13px;margin-bottom:14px}
#media-admin .mq-busca:focus{outline:none;border-color:#F2C230}

#media-admin .mq-subs{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px;margin-bottom:16px}
#media-admin .mq-sub{display:flex;align-items:center;gap:9px;background:#1b1e23;border:1px solid #363b42;border-radius:11px;
  padding:13px 14px;cursor:pointer;text-align:left;transition:.14s}
#media-admin .mq-sub:hover{background:#22262c;border-color:#F2C230;transform:translateY(-1px)}
#media-admin .mq-sub span{font-size:17px;line-height:1}
#media-admin .mq-sub b{flex:1 1 auto;color:#f2f4f7;font-family:'Oswald',sans-serif;font-size:14px;font-weight:500;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#media-admin .mq-sub i{font-style:normal;background:#2f343b;color:#c9cfd7;border-radius:10px;padding:2px 9px;font-size:11.5px}
#media-admin .mq-sub.feito{border-color:rgba(46,199,122,.45)}

#media-admin .mq-grelha{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:13px}
#media-admin .mq-fich{background:#1b1e23;border:1px solid #363b42;border-radius:12px;overflow:hidden;position:relative;transition:.14s}
#media-admin .mq-fich:hover{border-color:#F2C230;transform:translateY(-2px);box-shadow:0 6px 18px rgba(0,0,0,.45)}
#media-admin .mq-prev{display:block;background:#0e1013}
#media-admin .mq-fich img,#media-admin .mq-fich video{width:100%;aspect-ratio:1/1;object-fit:contain;display:block;padding:6px}
#media-admin .mq-fich-b{padding:9px 11px;border-top:1px solid #2f343b}
#media-admin .mq-fich-b b{display:block;font-size:13px;color:#f2f4f7;font-family:'Oswald',sans-serif;font-weight:500;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#media-admin .mq-fich-b small{color:#a8b0ba;font-size:11px}
#media-admin .mq-acts{position:absolute;top:7px;right:7px;display:flex;gap:4px;opacity:0;transition:opacity .14s}
#media-admin .mq-fich:hover .mq-acts,#media-admin .mq-fich:focus-within .mq-acts{opacity:1}
#media-admin .mq-acts button{background:rgba(12,14,17,.92);border:1px solid #454c55;color:#e8ebef;width:28px;height:28px;
  border-radius:7px;cursor:pointer;font-size:13px;display:flex;align-items:center;justify-content:center;padding:0}
#media-admin .mq-acts button:hover{background:#F2C230;border-color:#F2C230;color:#15130a}
#media-admin .mq-acts button.mau:hover{background:#d21f1f;border-color:#d21f1f;color:#fff}
#media-admin .mq-acts button.ok{background:#2ec77a;border-color:#2ec77a;color:#04220f}
@media(hover:none){#media-admin .mq-acts{opacity:1}}

#media-admin .mq-vazio{color:#a8b0ba;font-size:13.5px;line-height:1.75;padding:34px 20px;text-align:center;
  background:#16181c;border:1px dashed #454c55;border-radius:13px}
#media-admin .mq-vazio b{color:#f2f4f7}
#media-admin .mq-rodape{margin-top:16px;color:#a8b0ba;font-size:11.5px;line-height:1.7;border-top:1px solid #2f343b;padding-top:12px}
#media-admin .mq-rodape b{color:#dfe3e9}

/* ===== painel: interruptor da seccao e marca de pasta publica (bloco 145) ===== */
#media-admin .mq-seccao{margin-top:12px;padding:11px 12px;background:#1b1e23;border:1px solid #363b42;border-radius:11px;
  display:grid;grid-template-columns:1fr auto;gap:4px 10px;align-items:center}
#media-admin .mq-seccao b{color:#f2f4f7;font-family:'Oswald',sans-serif;font-size:13px;font-weight:500}
#media-admin .mq-seccao small{grid-column:1/-1;color:#a8b0ba;font-size:11px;line-height:1.5}
#media-admin .mq-sw{width:42px;height:23px;border-radius:999px;background:#3a4049;border:1px solid #4a515a;position:relative;cursor:pointer;padding:0;transition:.16s}
#media-admin .mq-sw span{position:absolute;top:2px;left:2px;width:17px;height:17px;border-radius:50%;background:#aeb6c0;transition:.16s}
#media-admin .mq-sw.on{background:#2ec77a;border-color:#2ec77a}
#media-admin .mq-sw.on span{left:21px;background:#04220f}
#media-admin .mq-btn.publ{background:rgba(10,186,181,.18);border-color:rgba(10,186,181,.6);color:#5fe6e2}
#media-admin .mq-globo{font-style:normal;font-size:11px;opacity:.95}

/* ===== site: seccao MEDIA, lado das fotos (bloco 146) ===== */
.bm-abas{display:flex;gap:8px;margin:4px 0 16px;flex-wrap:wrap}
.bm-aba{background:#1b1e23;border:1px solid #454c55;color:#dfe3e9;border-radius:999px;padding:9px 20px;
  font-family:'Oswald',sans-serif;font-size:13.5px;cursor:pointer;transition:.15s}
.bm-aba:hover{background:#262b32;border-color:#6a727d;color:#fff}
.bm-aba.on{background:#F2C230;border-color:#F2C230;color:#15130a;font-weight:600}

.bm-pastas{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.bm-pasta{display:flex;flex-direction:column;gap:0;background:#16181c;border:1px solid #363b42;border-radius:14px;
  overflow:hidden;cursor:pointer;text-align:left;padding:0;transition:.16s}
.bm-pasta:hover{border-color:#F2C230;transform:translateY(-3px);box-shadow:0 10px 26px rgba(0,0,0,.5)}
.bm-capa{display:block;background:#0e1013;aspect-ratio:4/3;overflow:hidden}
.bm-capa img{width:100%;height:100%;object-fit:cover;display:block;transition:.3s}
.bm-pasta:hover .bm-capa img{transform:scale(1.05)}
.bm-tt{display:block;padding:12px 14px 2px;color:#f2f4f7;font-family:'Oswald',sans-serif;font-size:15px;font-weight:500;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bm-n{display:block;padding:0 14px 13px;color:#a8b0ba;font-size:12px;font-family:'Oswald',sans-serif}

.bm-topo{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.bm-voltar{background:#1b1e23;border:1px solid #454c55;color:#dfe3e9;border-radius:9px;padding:8px 15px;
  font-family:'Oswald',sans-serif;font-size:13px;cursor:pointer;transition:.15s}
.bm-voltar:hover{border-color:#F2C230;color:#F2C230}
.bm-topo b{color:#F2C230;font-family:'Oswald',sans-serif;font-size:17px}
.bm-topo span{color:#a8b0ba;font-size:12.5px;font-family:'Oswald',sans-serif}

.bm-grelha{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.bm-foto{margin:0;background:#0e1013;border:1px solid #2f343b;border-radius:11px;overflow:hidden;cursor:zoom-in;transition:.15s}
.bm-foto:hover{border-color:#F2C230;transform:translateY(-2px)}
.bm-foto img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block}

.bm-ov{position:fixed;inset:0;z-index:99999;background:rgba(6,7,9,.95);display:none;align-items:center;justify-content:center}
.bm-ov.on{display:flex}
.bm-ov img{max-width:92vw;max-height:84vh;object-fit:contain;border-radius:8px;box-shadow:0 20px 60px rgba(0,0,0,.7)}
.bm-x,.bm-ant,.bm-seg{position:absolute;background:rgba(20,23,27,.9);border:1px solid #4a515a;color:#fff;cursor:pointer;
  border-radius:10px;display:flex;align-items:center;justify-content:center;transition:.15s}
.bm-x{top:18px;right:18px;width:42px;height:42px;font-size:26px;line-height:1}
.bm-ant,.bm-seg{top:50%;transform:translateY(-50%);width:48px;height:62px;font-size:30px;line-height:1}
.bm-ant{left:14px} .bm-seg{right:14px}
.bm-x:hover,.bm-ant:hover,.bm-seg:hover{background:#F2C230;border-color:#F2C230;color:#15130a}
.bm-leg{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);color:#dfe3e9;font-family:'Oswald',sans-serif;
  font-size:13.5px;background:rgba(20,23,27,.9);border:1px solid #363b42;border-radius:999px;padding:7px 18px}
@media(max-width:640px){
  .bm-ant,.bm-seg{width:40px;height:52px;font-size:25px}
  .bm-pastas{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
  .bm-grelha{grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}
}

/* ===================== LIXEIRA (bloco 147) ===================== */
#ap-lixo .lx-topo{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:#16181c;border:1px solid #363b42;
  border-radius:13px;padding:14px 16px;margin-bottom:14px}
#ap-lixo .lx-conta{display:flex;align-items:baseline;gap:7px}
#ap-lixo .lx-conta b{font-family:'Racing Sans One',cursive;font-size:30px;color:#F2C230;line-height:1}
#ap-lixo .lx-conta span{color:#a8b0ba;font-size:13px;font-family:'Oswald',sans-serif}
#ap-lixo .lx-acts{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
#ap-lixo .lx-btn{background:#22262c;border:1px solid #454c55;color:#e8ebef;border-radius:9px;padding:9px 16px;
  font-family:'Oswald',sans-serif;font-size:13px;cursor:pointer;transition:.14s;white-space:nowrap}
#ap-lixo .lx-btn:hover:not(:disabled){background:#2c313a;border-color:#6a727d}
#ap-lixo .lx-btn:disabled{opacity:.4;cursor:default}
#ap-lixo .lx-btn.mau{background:rgba(210,31,31,.16);border-color:rgba(210,31,31,.55);color:#ff8585}
#ap-lixo .lx-btn.mau:hover:not(:disabled){background:rgba(210,31,31,.3);color:#ffb3b3}
#ap-lixo .lx-msg{flex:1 1 100%;color:#5fe3a3;font-size:12.5px;font-family:'Oswald',sans-serif}
#ap-lixo .lx-nota{color:#a8b0ba;font-size:12px;line-height:1.7;margin-bottom:18px;border-left:2px solid #F2C230;padding-left:12px}
#ap-lixo .lx-nota b{color:#dfe3e9}
#ap-lixo .lx-sec{color:#a8b0ba;font-size:11px;text-transform:uppercase;letter-spacing:1.4px;font-weight:600;
  margin:18px 0 9px;display:flex;align-items:center;gap:8px}
#ap-lixo .lx-sec span{background:#2f343b;color:#c9cfd7;border-radius:10px;padding:1px 9px;font-size:11px;letter-spacing:0}
#ap-lixo .lx-lista{display:flex;flex-direction:column;gap:7px}
#ap-lixo .lx-item{display:flex;align-items:center;gap:12px;background:#1b1e23;border:1px solid #363b42;border-radius:11px;padding:11px 13px}
#ap-lixo .lx-item:hover{border-color:#4a515a}
#ap-lixo .lx-ico{font-size:19px;line-height:1;flex:0 0 auto;opacity:.9}
#ap-lixo .lx-tx{flex:1 1 auto;min-width:0}
#ap-lixo .lx-tx b{display:block;color:#f2f4f7;font-family:'Oswald',sans-serif;font-size:14px;font-weight:500;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#ap-lixo .lx-tx small{display:block;color:#a8b0ba;font-size:11.5px;margin-top:2px}
#ap-lixo .lx-bts{display:flex;gap:6px;flex:0 0 auto}
#ap-lixo .lx-bts button{background:#262b32;border:1px solid #4a515a;color:#e8ebef;border-radius:8px;padding:7px 13px;
  font-family:'Oswald',sans-serif;font-size:12.5px;cursor:pointer;transition:.14s}
#ap-lixo .lx-bts button:hover{background:#2ec77a;border-color:#2ec77a;color:#04220f}
#ap-lixo .lx-bts button.mau{padding:7px 11px}
#ap-lixo .lx-bts button.mau:hover{background:#d21f1f;border-color:#d21f1f;color:#fff}
#ap-lixo .lx-vazio{color:#a8b0ba;font-size:13.5px;line-height:1.8;padding:40px 22px;text-align:center;
  background:#16181c;border:1px dashed #454c55;border-radius:13px}
#ap-lixo .lx-vazio b{color:#f2f4f7}
#ap-lixo .lx-erro{margin-top:14px;color:#ffb3b3;background:rgba(210,31,31,.12);border:1px solid rgba(210,31,31,.4);
  border-radius:10px;padding:11px 14px;font-size:12.5px;line-height:1.6}

/* ============================================================================
   CONTRASTE DO PAINEL E DA AREA DO CLIENTE                   (09/10/2026)
   O Braga, duas vezes: "ta muito preto tudo", "o site precisa de vida, pelo
   menos a parte adm e customer por enquanto".

   O problema era medivel: os cartoes estavam a rgba(255,255,255,.03) sobre
   #0a0a0a, ou seja 1,05:1 contra o fundo. Isso e invisivel - nao se via onde
   um cartao comecava. As linhas a #2a2a2a davam 1,38:1, tambem nao ajudavam.

   O que mudei: uma escala de superficies a serio, linhas que se veem, e botoes
   cheios em vez de contornos fantasma. Medi todos os pares: o pior texto fica
   em 4,8:1 e a maioria passa dos 7:1, ou seja nao desaparece nada - era a
   condicao que ele poz. O fundo continua quase preto, que e a marca; o que
   muda e tudo o que esta POR CIMA dele.
   ========================================================================= */
:root{
  --sup-0:#0b0d11;   /* fundo da area                      */
  --sup-1:#181c23;   /* cartoes                            */
  --sup-2:#232932;   /* campos, zonas levantadas           */
  --sup-3:#2f3741;   /* passagem do rato, botoes neutros   */
  --risco:#3d4552;   /* divisorias finas, dentro do cartao */
  --borda:#5a6472;   /* contorno que se ve (3,2:1 no fundo)*/
  --tinta:#f4f6f9;   /* texto                              */
  --tinta-2:#bcc4ce;  /* texto secundario, ainda 6,8:1      */
}
/* os tokens antigos apontam para a escala nova, para apanhar o que ja os usa */
:root{ --bl-card:#181c23; --bl-line:#3d4552; --bl-line2:#5a6472; --bl-mut:#bcc4ce; }

/* ---- a area em si ------------------------------------------------------ */
#cat-admin.brand-page, .acct-wrap{ background:var(--sup-0); }

/* ---- cartoes e colunas laterais ---------------------------------------- */
#cat-admin .adm-card, .adm-card,
#cat-admin .adm-side, .acct-card, .acct-side{
  background:var(--sup-1)!important;
  border:1px solid var(--borda)!important;
  box-shadow:0 2px 10px rgba(0,0,0,.35);
}
#cat-admin .adm-card h3, .acct-card h3{ color:var(--tinta); }
#cat-admin .adm-card .hint, .adm-card .hint{ color:var(--tinta-2); }

/* ---- menu lateral: o item activo ja era amarelo, faltava ver os outros -- */
.adm-nav button, .acct-nav button{ color:var(--tinta-2); }
.adm-nav button:hover, .acct-nav button:hover{ background:var(--sup-3); color:#fff; }
.adm-nav button.on, .acct-nav button.on{ background:var(--yellow); color:#141206; font-weight:600;
  box-shadow:0 2px 10px -2px rgba(242,194,48,.55); }
.adm-side .adm-badge{ border-bottom-color:var(--risco); }
.adm-nav button.danger{ border-top-color:var(--risco); }

/* ---- numeros do topo: eram quase transparentes ------------------------- */
.adm-kpi{ background:linear-gradient(180deg,var(--sup-2),var(--sup-1))!important;
  border:1px solid var(--borda)!important; }
.adm-kpi .l{ color:var(--tinta-2); }

/* ---- tabelas ----------------------------------------------------------- */
.adm-table th{ color:var(--tinta-2); border-bottom:1px solid var(--borda); }
.adm-table td{ color:var(--tinta); border-bottom:1px solid var(--risco); }
.adm-table tr:hover td{ background:var(--sup-2); }

/* ---- campos: fundo mais fundo que o cartao, para se perceber onde escrever */
#cat-admin .set-in, #cat-admin .adm-in, #cat-admin .adm-sel,
#cat-admin input[type=text], #cat-admin input[type=number], #cat-admin input[type=email],
#cat-admin input[type=url], #cat-admin input[type=password], #cat-admin input[type=search],
#cat-admin input[type=date], #cat-admin textarea, #cat-admin select,
.acct-wrap input[type=text], .acct-wrap input[type=email], .acct-wrap input[type=tel],
.acct-wrap input[type=password], .acct-wrap textarea, .acct-wrap select{
  background:#0f1318!important;
  border:1px solid var(--borda)!important;
  color:var(--tinta)!important;
}
#cat-admin .set-in:focus, #cat-admin .adm-in:focus, #cat-admin .adm-sel:focus,
#cat-admin input:focus, #cat-admin textarea:focus, #cat-admin select:focus,
.acct-wrap input:focus, .acct-wrap textarea:focus, .acct-wrap select:focus{
  outline:none!important; border-color:var(--yellow)!important;
  box-shadow:0 0 0 3px rgba(242,194,48,.18)!important;
}
#cat-admin ::placeholder, .acct-wrap ::placeholder{ color:#8b94a0; opacity:1; }

/* ---- BOTOES: era aqui que se perdia tudo -------------------------------
   Os "ghost" ficavam transparentes com uma linha a 1,4:1, nao pareciam
   botoes. Agora sao cheios, com contorno visivel e uma resposta clara ao
   passar o rato. O principal mantem-se amarelo, que e a marca.            */
#cat-admin .adm-btn.ghost, #cat-admin button.ghost{
  background:var(--sup-3)!important; border:1px solid var(--borda)!important; color:var(--tinta)!important; }
#cat-admin .adm-btn.ghost:hover, #cat-admin button.ghost:hover{
  background:#39414d!important; border-color:var(--yellow)!important; color:var(--yellow)!important; }
#cat-admin .adm-btn, #cat-admin .set-btn, .acct-save{
  box-shadow:0 2px 10px -3px rgba(242,194,48,.5); transition:.15s; }
#cat-admin .adm-btn:hover, #cat-admin .set-btn:hover, .acct-save:hover{
  transform:translateY(-1px); box-shadow:0 5px 16px -4px rgba(242,194,48,.65); }
#cat-admin .adm-btn:active, #cat-admin .set-btn:active, .acct-save:active{ transform:translateY(0); }
#cat-admin .adm-btn.red{ box-shadow:0 2px 10px -3px rgba(210,31,31,.6); }
#cat-admin .adm-btn.red:hover{ box-shadow:0 5px 16px -4px rgba(210,31,31,.75); }

/* ---- o que estava a rgba(255,255,255,.02-.06) e nao se via -------------- */
#cat-admin [class*="-row"], #cat-admin [class*="-tile"], #cat-admin [class*="-box"],
#cat-admin [class*="-item"]{ border-color:var(--risco); }

/* ---- area do cliente: cartoes, estatisticas e atalhos ------------------- */
.acct-stat>*{ background:var(--sup-2); border:1px solid var(--borda); border-radius:11px; }
.acct-icon-btn{ background:var(--sup-2)!important; border:1px solid var(--borda)!important; transition:.15s; }
.acct-icon-btn:hover{ background:var(--sup-3)!important; border-color:var(--yellow)!important; transform:translateY(-2px); }
.acct-email, .acct-icon-label{ color:var(--tinta-2); }
.acct-name{ color:var(--tinta); }

/* ---- um toque de cor, que era o que faltava ----------------------------
   Cada cartao leva um fio da cor da marca no topo. Nao mexe no texto,
   so da vida e ajuda a separar um cartao do seguinte.                     */
#cat-admin .adm-card, .acct-card{ position:relative; overflow:hidden; }
#cat-admin .adm-card::before, .acct-card::before{
  content:""; position:absolute; top:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg,var(--yellow),rgba(242,194,48,0) 58%);
  opacity:.75; pointer-events:none;
}

/* ---- apanhar os textos que ficavam a 4,4:1, mesmo a beira do limite -----
   Medi a pagina inteira depois da mudanca e sobravam 53 textos entre 3,6 e
   4,4:1 - sobretudo as horas ("17m ago") e as etiquetas pequenas, que usavam
   o --muted #9a9a9a. Sobre a superficie nova isso cai para 4,28:1, abaixo do
   minimo. O Braga poz a condicao de nao perder texto nenhum, por isso levanto
   estes dois tons o suficiente para passarem em QUALQUER das superficies. */
#cat-admin, .acct-wrap{ --muted:#9b9fa5; }
#cat-admin .eyebrow, .acct-wrap .eyebrow,
#cat-admin [class*="eyebrow"], .acct-wrap [class*="eyebrow"]{ color:#b1b6bd!important; }
#cat-admin small, #cat-admin .ago, #cat-admin [class*="-ago"], #cat-admin [class*="-time"],
#cat-admin [class*="-date"], .acct-wrap small{ color:#b1b6bd; }
#cat-admin .adm-card .hint, #cat-admin .hint, .acct-wrap .hint{ color:#bcc4ce!important; }

/* ---- textos que ficavam fracos sobre as superficies novas -------------
   Varri o CSS a procura das regras do painel e da area do cliente cujo
   texto cai abaixo de 4,5:1 sobre o cartao. Saltei tudo o que pinta o
   proprio fundo (botoes amarelos, verdes, etc.), senao estaria a estragar
   texto escuro que vive sobre cor clara e esta certo. Sobraram 7 regras.
   O vermelho da marca em texto pequeno passa ao vermelho claro que o site
   ja usa noutros sitios: o #D21F1F so dava 3,2:1. */
#set-panel .set-opt{color:#8c919a!important}
#company-panel .set-opt,#cloud-panel .set-opt{color:#8c919a!important}
#partners-admin .set-opt{color:#8c919a!important}
#mapcfg-admin .set-opt{color:#8c919a!important}
#pay-panel .set-opt{color:#8c919a!important}
#cat-admin .blp-reg-h span{color:#8c919a!important}
#cat-admin .blp-mkt-m.off{color:#8d929a!important}
/* o rodape "Secure payment" dava 4,09:1 no cartao novo */
.bp-n{color:#a0a6b0}

/* redes novas nos projectos da comunidade (TikTok e link livre) */
.prj-lnk.tt{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.28);color:#fff}
.prj-lnk.tt:hover{background:#000;border-color:#25F4EE;color:#25F4EE}
.prj-lnk.site{background:rgba(242,194,48,.12);border:1px solid rgba(242,194,48,.45);color:#F2C230}
.prj-lnk.site:hover{background:#F2C230;color:#15130a}
.prj-lnk.site svg,.prj-lnk.tt svg{width:15px;height:15px;flex:none}

/* O Braga (09/10/2026) - Projetos: chamada em quadro branco logo abaixo da capa.
   O video ficou so com a imagem; o texto desceu para aqui, onde se le mesmo. */
#projects .prj-hero.capa{min-height:0;height:clamp(200px,34vw,420px);padding:0;display:block}
#projects .prj-call{background:#f4f6f9;border-top:3px solid var(--yellow,#F2C230);border-bottom:1px solid #d7dce3;padding:clamp(26px,4vw,44px) clamp(16px,5vw,60px)}
#projects .prj-call-in{max-width:820px;margin:0 auto;text-align:center}
#projects .prj-call-eye{font-family:'Oswald',sans-serif;font-weight:700;letter-spacing:3px;font-size:12px;text-transform:uppercase;color:#8a6a00}
#projects h2.prj-call-t{font-family:'Racing Sans One',sans-serif;font-size:clamp(26px,5vw,46px);line-height:1.05;letter-spacing:1px;color:#10131a;margin:8px 0 14px}
#projects p.prj-call-d{color:#2c333d;font-size:clamp(15px,1.6vw,17px);line-height:1.7;margin:0 auto;max-width:720px}
#projects .prj-call-acts{margin-top:22px}
#projects .prj-call .prj-add-btn{margin-top:0;background:#10131a;color:#fff;border:2px solid #10131a}
#projects .prj-call .prj-add-btn:hover{background:var(--yellow,#F2C230);color:#141414;box-shadow:0 8px 22px -6px rgba(16,19,26,.45)}
#projects .prj-call-note{margin-top:14px;font-size:13px;color:#555f6c}
@media (max-width:640px){ #projects .prj-call{padding:22px 16px} }

/* O Braga (09/10/2026) - Ranking: redes do piloto clicaveis no quadro publico.
   Mesmo aspeto dos links da seccao de Projetos, em versao compacta de tabela. */
.bl-socs{display:inline-flex;flex-wrap:wrap;gap:6px;margin-left:8px;vertical-align:middle}
.bl-soc{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:999px;
  border:1px solid var(--bl-line2,#5a6472);background:rgba(255,255,255,.06);color:#e8ebf0;
  font-size:11px;font-weight:600;line-height:1.4;text-decoration:none;max-width:170px;transition:.15s}
.bl-soc svg{width:13px;height:13px;flex:0 0 13px}
.bl-soc span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bl-soc:hover{transform:translateY(-1px);background:rgba(255,255,255,.14);border-color:var(--yellow,#F2C230);color:#fff}
.bl-soc.ig{color:#ff8fb0;border-color:#8c3a56}
.bl-soc.ig:hover{background:#e1306c;border-color:#e1306c;color:#fff}
.bl-soc.yt{color:#ff8a8a;border-color:#8c3030}
.bl-soc.yt:hover{background:#ff0000;border-color:#ff0000;color:#fff}
.bl-soc.tt{color:#8ff0ea;border-color:#2f6d69}
.bl-soc.tt:hover{background:#25f4ee;border-color:#25f4ee;color:#0b0d11}
.bl-soc.site{color:#d8dde5;border-color:#5a6472}
.bl-soc.site:hover{background:var(--yellow,#F2C230);border-color:var(--yellow,#F2C230);color:#141414}
@media (max-width:640px){ .bl-socs{display:flex;margin:5px 0 0} .bl-soc{max-width:130px} }
.bl-soc-note{margin:10px 0 8px;padding:9px 12px;border-radius:8px;border:1px solid var(--bl-line2,#5a6472);
  background:rgba(242,194,48,.07);color:#e8ebf0;font-size:12.5px;line-height:1.5}
.bl-soc-note b{color:var(--yellow,#F2C230)}

/* O Braga (09/10/2026) - Instagram: grelha propria com as ultimas publicacoes. */
.sp-ig-live{min-height:60px}
.sp-ig-load{color:#aeb4bd;font-size:13px;text-align:center;padding:18px 8px}
.sp-ig-feed{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.sp-ig-post{position:relative;display:block;aspect-ratio:1/1;border-radius:10px;overflow:hidden;
  border:1px solid rgba(255,255,255,.10);text-decoration:none;transition:.18s}
.sp-ig-post img{width:100%;height:100%;object-fit:cover;display:block}
.sp-ig-post:hover{transform:translateY(-2px);border-color:var(--yellow,#F2C230);box-shadow:0 10px 24px -10px rgba(0,0,0,.8)}
.sp-ig-play{position:absolute;top:8px;right:9px;font-size:13px;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.8)}
.sp-ig-likes{position:absolute;left:8px;bottom:7px;font:600 11px Oswald,sans-serif;color:#fff;
  text-shadow:0 1px 4px rgba(0,0,0,.9);letter-spacing:.3px}
.sp-ig-by{text-align:right;margin-top:7px}
.sp-ig-by a{color:#8d929b;font-size:11px;text-decoration:none}
.sp-ig-by a:hover{color:var(--yellow,#F2C230)}
@media (max-width:420px){ .sp-ig-feed{gap:6px} }



/* ===== O Braga (09/10/2026) - CONTRASTE DAS SECCOES PUBLICAS =====
   Fundo grafite claro (#262b36) escolhido pelo Braga, e o cabecalho de cada
   seccao num cartao cinzento com borda - integrado no fundo, nao colado por
   cima como estava o quadro branco.
   Os cartoes sobem acima da pagina, os campos de formulario descem abaixo
   dela (aspeto encaixado), e assim ve-se a diferenca entre as duas coisas.
   Fica intocado tudo o que tem de ser preto: fundos de foto, logos, mapa,
   capa, faixas de imagem e escurecimentos por cima de imagens. */
:root{ --bg:#262b36; --line:#525b6b; --muted:#c4cad3; }
body{ background:var(--bg) }

/* superficies solidas */
.prj-search{background:#1f2026}
.prj-brandsel{background:#353843}
.prj-form{background:#343843}
.prj-form input[type=text],.prj-form input:not([type]),.prj-form input[type=number],.prj-form textarea{background:#1e2027}
.prj-up{background:#343844}
.pja-row{background:#353843}
.acct-switcher{background:#363642}
#rewards-panel .rw-in{background:#1e2027}
#rewards-panel .rw-pt input{background:#1e2027}
.dr-brandfilter input{background:#1e2027}
#ap-members .mb-searchbox{background:#1e2027}
#blg-panel{background:#343844}
#blg-panel .blg-crow input,#blg-panel #blg-name{background:#1f1f26}
#blg-panel .blg-foot input{background:#1f1f26}
.msg-card{background:#353843}
.msg-in{background:#1d1f28}
#rankadm-body .adm-in{background:#1f1f26}
#export-body .ig-in,#export-body select{background:#1f1f26}
#invgen-body .ig-in{background:#1f1f26}
#invgen-body .ig-rowres{background:#363a42}
#margin-body .mg-in{background:#1f1f26}
#promos-body .promo-in{background:#1f1f26}
#margin-body .mg-edit{background:#363a42}
#aff-body .ig-in{background:#1f1f26}
#aff-dash .cf-field input{background:#1f1f26}
#maint-gate .mg-form input{background:#1e2027}
#ap-orders .ord-search input{background:#1e2027}
#ap-orders .ord-search select{background:#1e2027}
#set-panel .set-in{background:#1e2027}
#company-panel .set-in,#cloud-panel .set-in{background:#1e2027}
#partners-admin .set-in{background:#1e2027}
#media-admin .media-track{background:#333844}
.mp-search{background:#1e2027}
#media-admin .gal-addlib{background:#333844}
.sec-visbox{background:#323846}
#sections-admin .sec-name{background:#333844}
#sections-admin .sec-iconbox{background:#363642}
#media-admin .set-in{background:#1e2027}
.mapeng-opt{background:#343943}
.mmg-tab{background:#353843}
.mmg-row{background:#353843}
.tej-box{background:#343843}
.tej-bar{background:#333745}
.tej-bar input{background:#1e2027}
.blmap-cbar input{background:#1e2027}
#mapcfg-admin .set-in{background:#1e2027}
#integrations-admin .intg-in{background:#1e2027}
#developer-admin .dev-code{background:#343944}
#developer-admin .dev-in{background:#1e2027}
.rp-in{background:#1e2027}
.crews-box{background:#323945}
.crew-cbar input{background:#1e2027}
.blmap-search{background:#1e2027}
.brc-box{background:#323945}
#launch-admin .set-in{background:#1e2027}
.pa-box{background:#363642}
.pa-in{background:#1e2027}
#pay-panel .set-in{background:#1e2027}
.filter-search input{background:#261f1f}
.filter-field select,.filter-field input{background:#261f1f}
.prod-table thead th{background:#423636}
.prod-note{background:#423636}
.notif-panel{background:#363a42}
.cart-mini{background:#423636}
.cart-mini-qty button{background:#423636}
.cart-btn-view{background:#423636}
.cart-full-qty button{background:#423636}
.site-footer{background:#423636}
.vehm-search input{background:#1f1f26}
#cat-dyno select,#cat-dyno input[type=number]{background:#1e2027}
#cat-dyno .dyno-stock{background:#323846}
#cat-dyno .dyno-cat{background:#323846}
#cat-dyno .dyno-nums>div{background:#323846}
.vid-card{background:#343844}
.prod-pager .pg-btn{background:#333845}
#checkout-upsell .up-card{background:#323846}
.wl-card{background:#323846}
#wheels-showcase .wsc-search{background:#1e2027}
#wheels-showcase .wsc-ph{background:#333844}
.wd2{background:#323846}
.bpu-coupon{background:#333844}
#cat-exhausts .ex-banner{background:#363642}
#cat-exhausts .zp-item, #cat-formulaz .zp-item{background:#423636}
#cat-exhausts .exreq-f input,#cat-exhausts .exreq-f select,#cat-exhausts .exreq-f textarea{background:#1e2027}
#cat-account .bl-field input,#cat-account .bl-field select,#cat-account .bl-field textarea{background:#1e2027}
#cat-blacklist .bl-upload,#cat-account .bl-upload{background:#333844}
#cat-blacklist input,#cat-blacklist select,#cat-blacklist textarea{background:#1e2027}
#cat-blacklist .bl-proof{background:#333844}
#blpchat{background:#343843}
#blpchat .cx-body{background:#343944}
#blpchat .cx-foot{background:#343843}
#blpchat .cx-foot input{background:#1e2027}
#blpchat .cx-attach{background:#343844}
#blpchat .cx-modebar{background:#303748}
#blpchat .cx-thread:hover{background:#2d364b}
#blplang .lg-menu{background:#343843}
#blplang .lg-item:hover{background:#313847}
.mob-drawer{background:#343843}
.mob-drawer-h{background:#343843}
.lang-card{background:#323846}
.lang-card:hover{background:#313847}
.wh-vehbar{background:#323946}
.wh-col{background:#323846}
.wh-design{background:#323846}
.wh-modal-inner{background:#323946}
.wh-form input,.wh-form select{background:#1e2027}
.wh-row select,.wh-row input{background:#1e2027}
.wh-hardware{background:#323846}
.game-card{background:#323846}
#wp-wrap .wp-cars button{background:#343844}
#wp-wrap .wp-colors button{background:#343844}
#cat-admin .adm-card input:not([type=checkbox]):not([type=radio]), #cat-admin .adm-card select, #cat-admin .adm-card textarea, #cat-admin .adm-card .blp-in{background:#1e2027}
#cat-admin .blp-mkt{background:#323846}
#cat-admin .adm-card details{background:#323846}
#blpcur .lg-menu,#blpmkt .lg-menu{background:#343843}
.shc-p{background:#343a44}
.shc-p:focus{background:#333b45}
.mpp-in{background:#1d2128}
#blp-fab-menu{background:#303748}
#blp-fab-menu .fab-x:hover{background:#323846}
#blp-fab-menu .fab-it:hover,#blp-fab-menu .fab-it:active{background:#313847}
#blp-lang-pop{background:#343843}
.blp-redes .blr-it{background:#343843}
.blp-redes .blr-it:hover{background:#343944}
#tej-aviso{background:#343943}
.dyno-nomodel button{background:#363842}
#cat-tej .tejp-ask input{background:#1c2029}
#media-admin .mq-lado{background:#353a43}
#media-admin .mq-busca{background:#333845}
#media-admin .mq-vazio{background:#353a43}
.bm-pasta{background:#353a43}
#ap-lixo .lx-topo{background:#353a43}
#ap-lixo .lx-vazio{background:#353a43}

/* cartoes translucidos */
.prj-go{background:rgba(255,255,255,.09)}
.prod-filter{background:rgba(255,255,255,.09)}
.score-card .sc-bene{background:rgba(255,255,255,.09)}
.score-card .sc-rung{background:rgba(255,255,255,.09)}
.score-card .sc-earn{background:rgba(255,255,255,.09)}
#rewards-panel .rw-lvl{background:rgba(255,255,255,.09)}
.adm-bulk{background:rgba(255,255,255,.09)}
#ap-members .mb-pill{background:rgba(255,255,255,.09)}
#ap-members .mb-sumcard{background:rgba(255,255,255,.09)}
#rankadm-body .bl-tg{background:rgba(255,255,255,.09)}
#rankadm-body .radm-bulk{background:rgba(255,255,255,.09)}
#export-body .adm-card{background:rgba(255,255,255,.09)}
.acct-side{background:rgba(255,255,255,.09)}
#margin-body .mg-summary{background:rgba(255,255,255,.09)}
.age-points{background:rgba(255,255,255,.09)}
#promos-body .promo-item{background:rgba(255,255,255,.09)}
#aff-body .adm-card{background:rgba(255,255,255,.09)}
#aff-dash .aff-stat{background:rgba(255,255,255,.09)}
#mygames-list .mg-row{background:rgba(255,255,255,.09)}
.acct-card{background:rgba(255,255,255,.09)}
.acct-stat .s{background:rgba(255,255,255,.09)}
.track-card{background:rgba(255,255,255,.09)}
.adm-side{background:rgba(255,255,255,.09)}
.adm-card{background:rgba(255,255,255,.09)}
.bk-stat{background:rgba(255,255,255,.09)}
#set-panel .set-card{background:rgba(255,255,255,.09)}
#set-panel .pm-item{background:rgba(255,255,255,.09)}
#set-panel .co-opt{background:rgba(255,255,255,.09)}
.rev-box{background:rgba(255,255,255,.09)}
.rev-pre{background:rgba(255,255,255,.09)}
#pay-panel .pay-sec{background:rgba(255,255,255,.09)}
#pay-panel .co-opt{background:rgba(255,255,255,.09)}
#company-panel .pay-sec,#cloud-panel .pay-sec{background:rgba(255,255,255,.09)}
#cloud-panel .cloud-step{background:rgba(255,255,255,.09)}
#partners-admin .pn-card{background:rgba(255,255,255,.09)}
#media-admin .media-slot{background:rgba(255,255,255,.09)}
#media-admin .media-tab{background:rgba(255,255,255,.09)}
.mp-card{background:rgba(255,255,255,.09)}
#media-admin .media-mtab{background:rgba(255,255,255,.09)}
#media-admin .gal-folder{background:rgba(255,255,255,.09)}
#media-admin .gal-newfolder{background:rgba(255,255,255,.09)}
#media-admin .gal-empty{background:rgba(255,255,255,.09)}
#media-admin .gal-item{background:rgba(255,255,255,.09)}
#media-admin .gal-nofile{background:rgba(255,255,255,.09)}
#media-admin .gal-biggroup{background:rgba(255,255,255,.09)}
#sections-admin .sec-row{background:rgba(255,255,255,.09)}
.sec-vmode{background:rgba(255,255,255,.09)}
.sec-uitem{background:rgba(255,255,255,.09)}
.sec-unone{background:rgba(255,255,255,.09)}
#sections-admin .sec-iconopt{background:rgba(255,255,255,.09)}
.ms2-tab{background:rgba(255,255,255,.09)}
.ms2-card{background:rgba(255,255,255,.09)}
#mapcfg-admin .pay-sec{background:rgba(255,255,255,.09)}
#mapcfg-admin .map-step{background:rgba(255,255,255,.09)}
#mapcfg-admin .po-row{background:rgba(255,255,255,.09)}
#integrations-admin .intg-card{background:rgba(255,255,255,.09)}
#developer-admin .dev-st{background:rgba(255,255,255,.09)}
#developer-admin .pay-sec{background:rgba(255,255,255,.09)}
.rp-st{background:rgba(255,255,255,.09)}
.rp-sym{background:rgba(255,255,255,.09)}
.crews-tabs button{background:rgba(255,255,255,.09)}
.crew-card{background:rgba(255,255,255,.09)}
.cd-b{background:rgba(255,255,255,.09)}
#lock-list .lock-row{background:rgba(255,255,255,.09)}
#lock-list .lock-row2{background:rgba(255,255,255,.09)}
#lock-list .lk-m{background:rgba(255,255,255,.09)}
#launch-admin .pay-sec{background:rgba(255,255,255,.09)}
#partners-admin .pn-req{background:rgba(255,255,255,.09)}
#pay-panel .pm-item{background:rgba(255,255,255,.09)}
.an-kpi{background:rgba(255,255,255,.09)}
.an-box{background:rgba(255,255,255,.09)}
.cc-tile{background:rgba(255,255,255,.09)}
#admdetail-ov .admd-cust{background:rgba(255,255,255,.09)}
.adv-opt{background:rgba(255,255,255,.09)}
.adv-inc li{background:rgba(255,255,255,.09)}
.adv-result{background:rgba(255,255,255,.09)}
.wlc-btn{background:rgba(255,255,255,.09)}
.news-cat{background:rgba(255,255,255,.09)}
.news-card{background:rgba(255,255,255,.09)}
.model-chip{background:rgba(255,255,255,.09)}
.sub-tab{background:rgba(255,255,255,.09)}
.sp-ig-cell{background:rgba(255,255,255,.09)}
.cart-full-left{background:rgba(255,255,255,.09)}
.oc-bank{background:rgba(255,255,255,.09)}
.checkout-panel{background:rgba(255,255,255,.09)}
.contact-card{background:rgba(255,255,255,.09)}
.veh-tile{background:rgba(255,255,255,.09)}
.vmi-group{background:rgba(255,255,255,.09)}
.vmodel-chip{background:rgba(255,255,255,.09)}
.vmodel-card{background:rgba(255,255,255,.09)}
#capa .cbtn{background:rgba(255,255,255,.09)}
#capa .mp-sub{background:rgba(255,255,255,.09)}
table.prod-table tr{background:rgba(255,255,255,.09)}
#wheels-showcase .wsc-chip{background:rgba(255,255,255,.09)}
#wheels-showcase .wsc-card{background:rgba(255,255,255,.09)}
.bpu-coupon button{background:rgba(255,255,255,.09)}
.wh-order-steps li{background:rgba(255,255,255,.09)}
#cat-exhausts .fz-brandcard{background:rgba(255,255,255,.09)}
#cat-exhausts .exreq-brand{background:rgba(255,255,255,.09)}
#cat-exhausts .ex-anchor{background:rgba(255,255,255,.09)}
#cat-exhausts .ex-card, #cat-formulaz .ex-card{background:rgba(255,255,255,.09)}
#cat-exhausts .ex-chip{background:rgba(255,255,255,.09)}
#cat-blacklist .bl-gate{background:rgba(255,255,255,.09)}
#cat-blacklist .bl-tg{background:rgba(255,255,255,.09)}
.mob-grp{background:rgba(255,255,255,.09)}
.mob-grp-b>button{background:rgba(255,255,255,.09)}
.mob-grp-b .mob-drawer-cur button{background:rgba(255,255,255,.09)}
.mob-drawer-item{background:rgba(255,255,255,.09)}
.mob-drawer-langs button{background:rgba(255,255,255,.09)}
.mpp-row{background:rgba(255,255,255,.09)}
.mpp-chip{background:rgba(255,255,255,.09)}
.mpp-pod>div{background:rgba(255,255,255,.09)}
.mpp-pts>div{background:rgba(255,255,255,.09)}
.bdg{background:rgba(255,255,255,.09)}
.mpp-prof{background:rgba(255,255,255,.09)}
.tejc-opt{background:rgba(255,255,255,.09)}
.blp-redes{background:rgba(255,255,255,.09)}
.blp-cont i{background:rgba(255,255,255,.09)}
#tej-msgs .tej-m .tk-b a{background:rgba(255,255,255,.09)}
#marcas-admin .mk-kpi{background:rgba(255,255,255,.09)}
.sec-pub.aconferir{background:rgba(255,255,255,.09)}

/* ---- cabecalho de seccao: cartao cinzento (opcao 4) ---- */
.section-body>.eyebrow{background:#323948;color:#F2C230;margin:0;padding:34px 32px 8px;border:0;border-top:1px solid #4e5768;border-radius:0}
.section-body>.eyebrow::before,.section-body>.eyebrow::after{color:#e05a5a}
.section-body>h2{background:#323948;color:#fff;margin:0 0 24px;padding:0 32px 34px;border:0;border-bottom:2px solid var(--yellow,#F2C230)}
.section-body>h2+.sec-count{background:#323948;color:#dde3ec;margin:0 auto 36px;padding:16px 30px;border:1px solid #4e5768;border-radius:14px}
/* seccoes sem contador por baixo fecham o cartao no proprio titulo */
/* o titulo fecha sempre com o risco dourado, tenha ou nao subtitulo */
/* o Sobre Nos leva a historia da marca dentro do mesmo cartao */
/* A historia da marca tem largura propria, mais estreita que o cartao do
   cabecalho - metida la dentro ficavam dois blocos desalinhados. Fica fora,
   em texto simples sobre o fundo. */
#about .section-body>h2+.about-text{background:transparent;border:0;padding:0;margin:0 auto 26px}

/* corpo de texto das seccoes: um pouco maior e mais claro, le-se melhor */
.section-body p{color:#e4e9f0;font-size:16.5px;line-height:1.85}

@media(max-width:640px){.section-body>.eyebrow{padding:20px 16px 6px}.section-body>h2{padding:0 16px 8px}.section-body>h2+.sec-count{padding:0 16px 20px}#about .section-body>h2+.about-text{padding:6px 18px 20px}}

/* Com o fundo mais claro, estes cinzas e vermelhos pequenos deixaram de se ler.
   Sobem o tom; nenhum deles assenta em fundo claro (verificado regra a regra). */
#cat-wheels .wsc-more,#cat-wheels .wd-spec,#cat-wheels .wh-hint,#cat-wheels .wh-step span,
#cat-games .gc-year,#cat-vehicles .pg-info,.pg-info,#about .about-ch i,#about .about-ch span,
#cat-dyno .dyno-nums small,.prod-pager .pg-info{color:#b4bbc5}
#cat-wheels label,.filter-field label,.wh-form label{color:#bcc3cd}
.prod-card .pc-code{color:#a7aeb8}
#cat-dyno .ds-sub,#cat-dyno .dyno-note,#cat-dyno .dyno-cap,#cat-dyno .dyno-foot,#cat-dyno .dyno-nomodel b{color:#adb3bc}
#cat-wheels .wd-con{color:#b8a6ff}
.eyebrow{color:#ff6b6b}
#cat-dyno .eyebrow{color:#ff8a70 !important}
#cat-exhausts .fz-bc-cta{color:#ff6b6b}
#cat-dyno .dyno-legend span[style*="d21f1f" i]{color:#ff6b6b !important}
#cat-blacklist .bl-h .r,#cat-blacklist .r{color:#ff4d4d}
.blp-redes .blr-tx i,.blp-redes .blr-tx span,.blr-tx i,.blr-tx span{color:#b4bbc5}
#cat-blacklist .bl-marquee .r,#cat-blacklist .bl-mq-track .r{color:#ff4d4d}
.wh-steps,.wh-steps span{color:#b4bbc5}
#cat-blacklist .r{color:#ff4d4d !important}
.game-card .gc-price span,#cat-games .gc-price span,#cat-games span[style*="8a8f98" i]{color:#b4bbc5 !important}

/* O Braga (09/10/2026): os banners dos tipos de roda sao quadrados (1000x1000)
   e estavam a ser cortados pelos lados - lia-se "ARBON FIBER" em vez de
   "CARBON FIBER". Passam a caber inteiros. E a borda dourada fica fixa, nao so
   ao passar o rato. */
.wl-card{border:1px solid #F2C230}
.wl-card:hover{border-color:#F2C230;box-shadow:0 10px 26px -12px rgba(242,194,48,.55)}
.wl-card .wl-img{background:#0b0d11;display:flex;align-items:center;justify-content:center;padding:6px}
.wl-card .wl-img img{width:100%;height:auto;max-height:100%;object-fit:contain;display:block}

/* O Braga (09/10/2026): o cartao do cabecalho ficava em escada - o subtitulo
   tinha max-width proprio (760px) e era mais estreito que o titulo. Agora as
   tres partes tem a mesma largura e o cartao e um retangulo so.
   E nas seccoes que comecam colhadas ao topo, o cartao passava por baixo do
   cabecalho fixo e cortava o titulo. Ganham espaco em cima. */
.section-body>.eyebrow,.section-body>h2,.section-body>h2+.sec-count{
  display:block !important;width:100% !important;max-width:none !important;
  box-sizing:border-box !important;margin-left:0 !important;margin-right:0 !important}
.section-body>h2{padding-top:2px;line-height:1.1}
#catalog .section-body,#cat-blacklist .section-body,#cat-admin .section-body{padding-top:104px !important}
@media(max-width:640px){#catalog .section-body,#cat-blacklist .section-body{padding-top:84px !important}}

/* O Braga (09/10/2026, pelo desenho dele): o cabecalho deixa de ser um cartao
   unico. Em cima, a faixa do titulo atravessa o ecra de ponta a ponta e fecha
   com um risco dourado; em baixo, o subtitulo e um retangulo seu, separado por
   um espaco. E a fila das marcas ganha moldura, que sem ela parecia por acabar. */
.section-body>.eyebrow,.section-body>h2{
  width:100vw !important;max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important;margin-right:calc(50% - 50vw) !important;
  padding-left:max(32px,calc(50vw - 550px)) !important;
  padding-right:max(32px,calc(50vw - 550px)) !important}
.section-body>h2+.sec-count{max-width:860px !important;
  margin-left:auto !important;margin-right:auto !important;width:auto !important}

/* moldura da fila de marcas */
#cat-vehicles .veh-marquee,#homeveh .veh-marquee,.veh-marquee{
  border:2px solid var(--yellow,#F2C230);border-radius:14px;background:rgba(255,255,255,.045);
  padding:16px 12px;max-width:1240px;box-shadow:0 10px 30px -18px rgba(242,194,48,.45)}
.veh-marquee .veh-mq-tile{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.12)}

/* O Braga (09/10/2026): os botoes de categoria estavam a quebrar linha ao
   calhar - 6, depois 5, depois 4 - com larguras todas diferentes. Passam a
   grelha de colunas iguais: alinham na vertical e na horizontal, com o numero
   de pecas encostado a direita. E a fila de marcas ganha moldura, como a dos
   veiculos, para nao parecer por acabar. */
.perfsub-row{display:grid !important;grid-template-columns:repeat(auto-fill,minmax(196px,1fr));
  gap:10px;max-width:1100px;margin:0 auto 30px;align-items:stretch}
.perfsub-chip{justify-content:flex-start;padding:12px 15px;border-radius:10px;min-height:48px;
  white-space:nowrap;overflow:hidden}
.perfsub-chip>span:not(.pc-ico):not(.pc-n){overflow:hidden;text-overflow:ellipsis}
.perfsub-chip .pc-n{margin-left:auto;padding-left:10px;font-variant-numeric:tabular-nums}
@media(max-width:640px){.perfsub-row{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
  .perfsub-chip{padding:10px 12px;min-height:42px}}

/* moldura das filas de marcas: performance, turbos, escapes, detailing */
.mw-list,.mw-cardrow,.brand-carousel{border:2px solid var(--yellow,#F2C230);border-radius:14px;
  background:rgba(255,255,255,.045);padding:16px 12px;box-sizing:border-box;
  box-shadow:0 10px 30px -18px rgba(242,194,48,.45)}
.mw-list .mw-card,.mw-cardrow .mw-card{background:rgba(255,255,255,.05)}
.mw-crumb{margin-top:10px}

/* Video de fundo na faixa do titulo (Catalogo). O texto fica sempre a frente,
   com um escurecimento por cima do video para se ler em qualquer fotograma. */
.section-body{position:relative}
.tit-video{position:absolute;top:0;left:50%;transform:translateX(-50%);width:100vw;
  overflow:hidden;z-index:0;pointer-events:none}
.tit-video video{width:100%;height:100%;object-fit:cover;display:block}
.tit-ov{position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(8,10,14,.58) 0%,rgba(8,10,14,.70) 55%,rgba(8,10,14,.80) 100%)}
.tem-faixa-video .section-body>.eyebrow,
.tem-faixa-video .section-body>h2{position:relative;z-index:1;background:transparent !important}
.tem-faixa-video .section-body>h2{text-shadow:0 2px 18px rgba(0,0,0,.75)}
.tem-faixa-video .section-body>.eyebrow{text-shadow:0 2px 12px rgba(0,0,0,.8)}

/* O Braga (09/10/2026, pelos desenhos): tres respiros que faltavam no Catalogo.
   O subtitulo estava colado ao risco dourado; a barra com o numero de produtos
   estava esmagada contra o fundo da caixa; e os numeros de pagina colados por
   baixo dela. */
.section-body>h2+.sec-count{margin-top:18px !important;margin-bottom:34px !important}
.prod-filter .filter-count{margin-top:26px;margin-bottom:6px;padding:14px 18px}
.prod-pager{margin-top:30px !important}
@media(max-width:640px){
  .section-body>h2+.sec-count{margin-top:12px !important;margin-bottom:24px !important}
  .prod-filter .filter-count{margin-top:18px;padding:12px 14px}
  .prod-pager{margin-top:22px !important}
}
.tit-foto{position:absolute;inset:0;background-size:cover;background-position:center}

/* A caixa dos produtos do catalogo com a mesma moldura dourada das marcas. */
.prod-table-wrap{border:2px solid var(--yellow,#F2C230) !important;border-radius:14px !important;
  box-shadow:0 12px 34px -20px rgba(242,194,48,.5)}


/* O Braga (09/10/2026): o espaco entre o risco dourado e o subtitulo nao descia
   abaixo de 24px porque a margem do titulo e a do subtitulo encostam uma na
   outra e manda a maior. Zera-se a do titulo e manda so a do subtitulo. */
.section-body>h2{margin-bottom:0 !important}
.section-body>h2+.sec-count{margin-top:18px !important}
@media(max-width:640px){
  .section-body>h2+.sec-count{margin-top:12px !important}
}
/* A faixa do titulo so aparece depois de medida como deve ser, sem salto. */
.tit-video{opacity:0;transition:opacity .4s ease}
.tit-video.pronta{opacity:1}

/* Video de fundo na caixa dos filtros do catalogo. Fica por tras de tudo; o
   escurecimento que a caixa ja tinha (::after) continua por cima, para os
   campos e as etiquetas se lerem. */
.prod-filter.tem-fundo-video{background-image:none !important}
.cx-video{position:absolute;inset:0;z-index:0;overflow:hidden;border-radius:inherit;pointer-events:none}
.cx-video video{width:100%;height:100%;object-fit:cover;display:block}
.cx-foto{position:absolute;inset:0;background-size:cover;background-position:center}

/* O Braga (09/10/2026): o quadro do subtitulo fica agora a igual distancia do
   risco dourado por cima e da caixa dos filtros por baixo - 40px de cada lado.
   Estava 18 em cima e 84 em baixo porque a margem do quadro e a da caixa
   somavam-se em vez de encostarem uma na outra. */
#catalog .section-body>h2+.sec-count{margin-top:40px !important;margin-bottom:0 !important}
#catalog .prod-filter{margin-top:40px !important}
@media(max-width:640px){
  #catalog .section-body>h2+.sec-count{margin-top:26px !important;margin-bottom:0 !important}
  #catalog .prod-filter{margin-top:26px !important}
}

/* ===== O Braga (09/10/2026): moldura dourada e video de fundo em TODAS as
   caixas de filtros do site - a mesma moldura das marcas e do catalogo.
   O video entra por tras (.cx-video, z-index 0) e o escurecimento que a caixa
   ja tinha (::after) continua por cima, para os campos e as etiquetas se lerem
   em qualquer fotograma. */
.prod-filter{border:2px solid var(--yellow,#F2C230) !important;border-radius:14px !important;
  box-shadow:0 12px 34px -20px rgba(242,194,48,.5),
             inset 0 1px 0 rgba(255,255,255,.05),
             inset 0 0 120px rgba(0,0,0,.5) !important}
/* Com video atras, a caixa nao precisa da sua propria cor a lavar a imagem. */
.prod-filter.tem-fundo-video{background-color:rgba(10,11,14,.25) !important}
/* Um pouco mais de escuro por cima do video do que o gradiente sozinho dava,
   agora que isto vai para caixas de todos os tamanhos. */
.prod-filter.tem-fundo-video::after{
  background:linear-gradient(180deg,rgba(8,10,14,.52) 0%,rgba(8,10,14,.62) 55%,rgba(8,10,14,.72) 100%) !important}
.prod-filter.tem-fundo-video label,
.prod-filter.tem-fundo-video .fsub,
.prod-filter.tem-fundo-video h3{text-shadow:0 2px 12px rgba(0,0,0,.85)}

/* ===== O Braga (09/10/2026, pelo desenho no telemovel) ===================== */

/* 1. O botao MENU encostado a esquerda, com folga para nao tocar na borda.
   Estava a 76px porque antes havia outro botao a esquerda dele; esse ja nao
   existe e o canto ficava vazio. */
@media(max-width:1024px){
  #blp-home-btn{left:14px !important}
}

/* 2. A faixa do titulo de ponta a ponta do ecra, sem depender da largura da
   seccao que a contem. */
.tit-video{left:50% !important;right:auto !important;
  width:100vw !important;max-width:100vw !important;
  margin-left:0 !important;margin-right:0 !important;
  transform:translateX(-50%) !important}
.tit-video video{width:100% !important;height:100% !important;object-fit:cover !important}
/* o texto da faixa centrado, que e como ele o quer */
.tem-faixa-video .section-body>.eyebrow,
.tem-faixa-video .section-body>h2{text-align:center}

/* 3. O subtitulo numa linha so. O tamanho da letra e acertado por medicao
   (ver BLPCatalogoTelemovel); aqui so se impede a quebra e se encolhe o
   cinzento a volta, para ficar proporcional a uma linha. */
@media(max-width:640px){
  .section-body>h2+.sec-count.uma-linha{
    white-space:nowrap !important;overflow:hidden !important;
    padding:11px 12px !important;line-height:1.25 !important;
    border-radius:11px !important}
}

/* 4. Banner de fundo atras da caixa dos produtos. Fica por tras dela, nao
   dentro: a caixa rola por dentro e o video tem de ficar quieto. */
.cx-atras{position:absolute;z-index:0;overflow:hidden;border-radius:14px;pointer-events:none}
.cx-atras video{width:100%;height:100%;object-fit:cover;display:block}
.cx-atras::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(8,10,14,.62) 0%,rgba(8,10,14,.70) 55%,rgba(8,10,14,.78) 100%)}
.prod-table-wrap.tem-fundo-atras{position:relative;z-index:1;
  background:transparent !important;background-image:none !important}
.prod-table-wrap.rola-dentro{overflow-y:auto;-webkit-overflow-scrolling:touch;
  scrollbar-width:thin;scrollbar-color:var(--yellow,#F2C230) transparent}
.prod-table-wrap.rola-dentro::-webkit-scrollbar{width:8px}
.prod-table-wrap.rola-dentro::-webkit-scrollbar-thumb{
  background:rgba(242,194,48,.55);border-radius:8px}
.prod-table-wrap.rola-dentro::-webkit-scrollbar-track{background:transparent}

/* 5. Tres colunas de produtos no telemovel, em vez de duas. */
@media(max-width:640px){
  .prod-grid,.cat-grid,.results-grid{grid-template-columns:repeat(3,1fr) !important;gap:6px !important}
  .prod-table-wrap.cards-mode{padding:10px !important;max-width:none !important}
}

/* 6. O cartao do produto com tres colunas no telemovel. Com 90px de largura
   o cartao antigo rebentava: o texto saia pela borda fora e a foto ficava
   com 36px de altura. Aqui so se aperta o que e texto e devolve-se a foto
   ao seu quadrado - e a foto que o cliente ve primeiro. */
@media(max-width:640px){
  .prod-grid>.prod-card{min-width:0;overflow:hidden}
  .prod-card .pc-ph{aspect-ratio:1/1;height:auto !important;min-height:0}
  .prod-card .pc-ph img{width:100%;height:100%;object-fit:cover}
  .prod-card .pc-body{padding:7px 7px 8px !important;min-width:0}
  .prod-card .pc-body>*{min-width:0;max-width:100%}
  .prod-card .pc-brand{font-size:9px !important;line-height:1.2 !important;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .prod-card .pc-code{font-size:8.5px !important;line-height:1.2 !important;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  /* o min-height:32px que vinha de tras ganhava ao max-height e deixava
     assomar uma terceira linha cortada ao meio - ficava sujo */
  .prod-card .pc-name{font-size:10.5px !important;line-height:13px !important;
    display:-webkit-box !important;-webkit-line-clamp:2 !important;
    -webkit-box-orient:vertical !important;
    overflow:hidden !important;min-height:0 !important;max-height:26px !important}
  .prod-card .pc-name a{font-size:inherit !important;line-height:inherit !important}
  .prod-card .pc-stock{font-size:8.5px !important;line-height:1.25 !important;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  /* "Price on request" nao cabe numa linha: deixa-se partir em duas em vez
     de ficar cortado com reticencias */
  .prod-card .pc-price{font-size:12.5px !important;line-height:1.2 !important;
    white-space:normal;overflow:hidden;margin-top:3px !important;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .prod-card .pc-btns{padding-top:6px !important;gap:4px}
  .prod-card .pc-add,.prod-card .pc-view{
    font-size:9.5px !important;line-height:1.15 !important;padding:7px 3px !important;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .prod-card .bw-star{width:26px !important;height:26px !important;top:5px;right:5px}
  .prod-card .bw-star svg{width:13px;height:13px}
}

/* 7. A barra com a contagem de produtos dentro da caixa: tinha um castanho
   lavado que nao e de lado nenhum do site. Fica um painel escuro com um risco
   dourado por baixo, a condizer com a moldura da caixa. */
.prod-table-wrap .prod-note{
  background:rgba(12,14,18,.88) !important;color:#d7dce4 !important;
  border:1px solid rgba(242,194,48,.35) !important;border-radius:11px !important;
  padding:11px 13px !important;margin-bottom:12px !important;
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
@media(max-width:640px){
  .prod-table-wrap .prod-note{font-size:10.5px !important;line-height:1.35 !important;
    padding:9px 10px !important;margin-bottom:9px !important}
}

/* 8. O risco dourado por baixo do titulo tambem vai de ponta a ponta: estava
   preso ao h2, que vive dentro das margens da seccao. Passa a ser a borda de
   baixo da propria faixa, que ocupa o ecra todo. */
.tem-faixa-video .tit-video{border-bottom:2px solid var(--yellow,#F2C230)}
.tem-faixa-video .section-body>h2{border-bottom-color:transparent !important}
/* e o risco cinzento que sobrava no cimo da faixa, do cartao do cabecalho */
.tem-faixa-video .section-body>.eyebrow{border-top-color:transparent !important}

/* 9. O espaco que o browser reserva para um cartao ainda nao pintado
   (content-visibility) estava nos 482px do cartao grande. Com tres colunas
   apertadas o cartao mede ~290px: sem isto, as filas por pintar mediam 484 e
   a caixa dos produtos saia com o dobro da altura que devia. */
@media(max-width:640px){
  @supports (content-visibility:auto){
    .prod-card{contain-intrinsic-size:auto 296px}
  }
}

/* ===== O Braga (10/10/2026): "Find Your Application" com o carbono por tras,
   um pouco mais escuro do que no catalogo e com o titulo em destaque por cima,
   como ele pediu. */
#cat-vehicles .tit-ov,#homeveh .tit-ov{
  background:linear-gradient(180deg,rgba(6,7,10,.74) 0%,rgba(6,7,10,.80) 55%,rgba(6,7,10,.88) 100%)}
#cat-vehicles.tem-faixa-video .section-body>h2,
#homeveh.tem-faixa-video .section-body>h2{
  text-shadow:0 3px 26px rgba(0,0,0,.92), 0 0 46px rgba(0,0,0,.7);
  letter-spacing:.4px}
#cat-vehicles.tem-faixa-video .section-body>.eyebrow,
#homeveh.tem-faixa-video .section-body>.eyebrow{
  text-shadow:0 2px 16px rgba(0,0,0,.92)}

/* ===== O Braga (10/10/2026): a faixa do titulo fechada em cima e em baixo.
   O risco de cima e o que separa o menu da capa; o de baixo ja la estava. */
.tem-faixa-video .tit-video{border-top:2px solid var(--yellow,#F2C230)}
/* E a pagina sobe um pouco: o corpo da seccao comecava 104px abaixo do topo,
   com o cabecalho fixo a ocupar so 78. */
@media(min-width:641px){
  #catalog .section-body,#cat-blacklist .section-body,#cat-admin .section-body{
    padding-top:88px !important}
}

/* ===== O Braga (10/10/2026): os quadrados das marcas estavam da mesma cor do
   painel que os segura (ambos branco a 4,5-5%) e desapareciam dentro dele.
   Ficam pretos: o quadrado branco do logotipo e as letras brancas saltam. */
.veh-marquee .veh-mq-tile,
#cat-vehicles .veh-mq-tile,#homeveh .veh-mq-tile{
  background:#08090b !important;
  border:1px solid rgba(255,255,255,.14) !important;
  border-radius:10px}
.veh-marquee .veh-mq-tile:hover,
#cat-vehicles .veh-mq-tile:hover,#homeveh .veh-mq-tile:hover{
  background:#101217 !important;border-color:rgba(242,194,48,.5) !important}
/* os mesmos quadrados na grelha A-Z por baixo, senao ficavam dois aspetos */
#cat-vehicles .veh-tile,#homeveh .veh-tile{
  background:#08090b !important;border:1px solid rgba(255,255,255,.14) !important}
#cat-vehicles .veh-tile:hover,#homeveh .veh-tile:hover{
  background:#101217 !important;border-color:rgba(242,194,48,.5) !important}

/* ===== O Braga (10/10/2026): MODO DE TESTE "fundo branco" ==================
   So entra em quem abrir o site com ?branco=1. Sem essa classe no body, nada
   disto existe - o site publico fica exatamente como esta. */
body.teste-branco{
  --bg:#ffffff; --line:#d3d8e0; --muted:#4e5662;
  background:#ffffff !important;
}
/* so a seccao, nunca o .section-body: a faixa de carbono e irma dele e vive
   por tras: pintar o corpo de branco tapava-a ao meio. */
body.teste-branco .section,
body.teste-branco .brand-page{background:#ffffff !important}
body.teste-branco .section-body,
body.teste-branco .prod-block{background:transparent !important}
/* o cartao cinzento do cabecalho da seccao deixa de fazer sentido em branco */
body.teste-branco .section-body>.eyebrow{background:transparent !important}
body.teste-branco .section-body>h2{background:transparent !important}

/* A frase por baixo do titulo: sem quadro, preta, grande, de ponta a ponta da
   caixa dos filtros. O tamanho da letra e medido no ecra (BLPTesteBranco). */
body.teste-branco .section-body>h2+.sec-count{
  background:transparent !important;
  border:0 !important;border-radius:0 !important;
  color:#0a0b0d !important;
  max-width:1000px !important;width:100% !important;
  margin:30px auto 34px !important;padding:0 !important;
  font-weight:700 !important;line-height:1.1 !important;
  white-space:nowrap !important;overflow:hidden !important;
  text-align:center !important}

/* O que ficava a assentar no cinzento e agora assenta no branco */
body.teste-branco .sec-count,
body.teste-branco .veh-mq-crumb,
body.teste-branco .veh-search-note,
body.teste-branco .prod-pager,
body.teste-branco .mw-crumb{color:#3c434e !important}
body.teste-branco .prod-pager button{color:#1a1d22 !important;border-color:#c9cfd8 !important}
body.teste-branco .section-body>.eyebrow{color:#9a7a10 !important}
/* a faixa de carbono fica como esta: e ela que separa o branco do menu */
body.teste-branco .tem-faixa-video .section-body>h2{color:#fff !important}
body.teste-branco .tem-faixa-video .section-body>.eyebrow{color:#F2C230 !important}

/* ===== MODO BRANCO: os paineis que eram branco-translucido sobre o grafite
   desapareciam sobre o branco. Passam a escuros, que e o aspeto que o Braga
   aprovou no catalogo: pagina branca, caixas escuras com moldura. Gerado a
   partir da lista real de regras da folha, nao a mao. ===== */
body.teste-branco #admdetail-ov .admd-cust,
body.teste-branco #aff-body .adm-card,
body.teste-branco #aff-dash .aff-stat,
body.teste-branco #ap-members .mb-pill,
body.teste-branco #ap-members .mb-sumcard,
body.teste-branco #capa .cbtn,
body.teste-branco #capa .mp-sub,
body.teste-branco #cat-blacklist .bl-gate,
body.teste-branco #cat-blacklist .bl-tg,
body.teste-branco #cat-exhausts .ex-anchor,
body.teste-branco #cat-exhausts .ex-card,
body.teste-branco #cat-exhausts .ex-chip,
body.teste-branco #cat-exhausts .exreq-brand,
body.teste-branco #cat-exhausts .fz-brandcard,
body.teste-branco #cat-formulaz .ex-card,
body.teste-branco #cloud-panel .cloud-step,
body.teste-branco #cloud-panel .pay-sec,
body.teste-branco #company-panel .pay-sec,
body.teste-branco #developer-admin .dev-st,
body.teste-branco #developer-admin .pay-sec,
body.teste-branco #export-body .adm-card,
body.teste-branco #integrations-admin .intg-card,
body.teste-branco #launch-admin .pay-sec,
body.teste-branco #lock-list .lk-m,
body.teste-branco #lock-list .lock-row,
body.teste-branco #lock-list .lock-row2,
body.teste-branco #mapcfg-admin .map-step,
body.teste-branco #mapcfg-admin .pay-sec,
body.teste-branco #mapcfg-admin .po-row,
body.teste-branco #marcas-admin .mk-kpi,
body.teste-branco #margin-body .mg-summary,
body.teste-branco #media-admin .gal-biggroup,
body.teste-branco #media-admin .gal-empty,
body.teste-branco #media-admin .gal-folder,
body.teste-branco #media-admin .gal-item,
body.teste-branco #media-admin .gal-newfolder,
body.teste-branco #media-admin .gal-nofile,
body.teste-branco #media-admin .media-mtab,
body.teste-branco #media-admin .media-slot,
body.teste-branco #media-admin .media-tab,
body.teste-branco #mygames-list .mg-row,
body.teste-branco #partners-admin .pn-card,
body.teste-branco #partners-admin .pn-req,
body.teste-branco #pay-panel .co-opt,
body.teste-branco #pay-panel .pay-sec,
body.teste-branco #pay-panel .pm-item,
body.teste-branco #promos-body .promo-item,
body.teste-branco #rankadm-body .bl-tg,
body.teste-branco #rankadm-body .radm-bulk,
body.teste-branco #rewards-panel .rw-lvl,
body.teste-branco #sections-admin .sec-iconopt,
body.teste-branco #sections-admin .sec-row,
body.teste-branco #set-panel .co-opt,
body.teste-branco #set-panel .pm-item,
body.teste-branco #set-panel .set-card,
body.teste-branco #tej-msgs .tej-m .tk-b a,
body.teste-branco #wheels-showcase .wsc-card,
body.teste-branco #wheels-showcase .wsc-chip,
body.teste-branco .acct-card,
body.teste-branco .acct-side,
body.teste-branco .acct-stat .s,
body.teste-branco .adm-bulk,
body.teste-branco .adm-card,
body.teste-branco .adm-side,
body.teste-branco .adv-inc li,
body.teste-branco .adv-opt,
body.teste-branco .adv-result,
body.teste-branco .age-points,
body.teste-branco .an-box,
body.teste-branco .an-kpi,
body.teste-branco .bdg,
body.teste-branco .bk-stat,
body.teste-branco .blp-cont i,
body.teste-branco .blp-redes,
body.teste-branco .bpu-coupon button,
body.teste-branco .cart-full-left,
body.teste-branco .cc-tile,
body.teste-branco .cd-b,
body.teste-branco .checkout-panel,
body.teste-branco .contact-card,
body.teste-branco .crew-card,
body.teste-branco .crews-tabs button,
body.teste-branco .mob-drawer-item,
body.teste-branco .mob-drawer-langs button,
body.teste-branco .mob-grp,
body.teste-branco .mob-grp-b .mob-drawer-cur button,
body.teste-branco .mob-grp-b>button,
body.teste-branco .model-chip,
body.teste-branco .mp-card,
body.teste-branco .mpp-chip,
body.teste-branco .mpp-pod>div,
body.teste-branco .mpp-prof,
body.teste-branco .mpp-pts>div,
body.teste-branco .mpp-row,
body.teste-branco .ms2-card,
body.teste-branco .ms2-tab,
body.teste-branco .news-card,
body.teste-branco .news-cat,
body.teste-branco .oc-bank,
body.teste-branco .prj-go,
body.teste-branco .pw-meter .pw-bar,
body.teste-branco .rev-box,
body.teste-branco .rev-pre,
body.teste-branco .rp-st,
body.teste-branco .rp-sym,
body.teste-branco .score-card .sc-bene,
body.teste-branco .score-card .sc-earn,
body.teste-branco .score-card .sc-rung,
body.teste-branco .sec-pub.aconferir,
body.teste-branco .sec-uitem,
body.teste-branco .sec-unone,
body.teste-branco .sec-vmode,
body.teste-branco .sp-ig-cell,
body.teste-branco .sub-tab,
body.teste-branco .tejc-opt,
body.teste-branco .track-card,
body.teste-branco .veh-tile,
body.teste-branco .vmi-group,
body.teste-branco .vmodel-card,
body.teste-branco .vmodel-chip,
body.teste-branco .wh-order-steps li,
body.teste-branco .wlc-btn,
body.teste-branco table.prod-table tr{background:rgba(14,16,21,.94) !important;
  border-color:rgba(255,255,255,.14) !important}

/* ===== MODO BRANCO, 2.a passagem: o que sobrou depois de escurecer os
   paineis translucidos. Sao blocos que tinham fundo proprio quase branco ou
   nenhum fundo, e cujo texto foi escolhido para assentar no grafite. ===== */

/* cartoes de marca das filas (logotipo branco + nome branco) */
body.teste-branco .mw-card,
body.teste-branco .veh-mq-tile,
body.teste-branco .brand-card,
body.teste-branco .bcard{background:rgba(14,16,21,.94) !important;
  border-color:rgba(255,255,255,.14) !important}

/* avaliacoes do Google e Instagram: cartoes escuros, como no resto */
body.teste-branco .grev-card,body.teste-branco .grev-r,
body.teste-branco .grev-score,body.teste-branco .grev-btns,
body.teste-branco .grev-head,body.teste-branco .sp-block,
body.teste-branco .sp-ig-head,body.teste-branco .sp-ig-live,
body.teste-branco .sp-ig-post{background:rgba(14,16,21,.94) !important;
  border-color:rgba(255,255,255,.14) !important}

/* oficinas parceiras */
body.teste-branco .partner-card,body.teste-branco .partner-body,
body.teste-branco .partner-invite{background:rgba(14,16,21,.94) !important;
  border-color:rgba(255,255,255,.14) !important}

/* texto corrido do About: estava claro para fundo escuro */
body.teste-branco .about-text,
body.teste-branco .about-text p,
body.teste-branco .about-text strong,
body.teste-branco .about-text b,
body.teste-branco .about-text small,
body.teste-branco .about-text span{color:#1a1e25 !important}
body.teste-branco #about .section-body>p,
body.teste-branco #about .section-body strong{color:#1a1e25 !important}

/* titulos de seccao que nao tem a faixa de carbono por tras */
body.teste-branco .section-body>.sec-title,
body.teste-branco .section-body>h2{color:#0e1116 !important;text-shadow:none !important}
body.teste-branco .tem-faixa-video .section-body>.sec-title,
body.teste-branco .tem-faixa-video .section-body>h2{color:#fff !important;
  text-shadow:0 2px 18px rgba(0,0,0,.75) !important}
body.teste-branco .section-body>.eyebrow{color:#8a6a08 !important}
body.teste-branco .tem-faixa-video .section-body>.eyebrow{color:#F2C230 !important}
body.teste-branco .cat-brands-title{color:#8a6a08 !important}

/* o dourado nao se le em branco: escurece-se quando assenta na pagina */
body.teste-branco .xlink,
body.teste-branco .co-tx b,
body.teste-branco .tracks-toggle span{color:#8a6a08 !important}

/* barra de paginas: eu proprio lhe tinha posto texto escuro sobre botao
   escuro - os botoes passam a claros */
body.teste-branco .prod-pager button,
body.teste-branco .prod-pager .pg-btn{background:#eef0f4 !important;
  color:#1a1d22 !important;border:1px solid #c9cfd8 !important}
body.teste-branco .prod-pager .pg-info{color:#39404b !important}
body.teste-branco .prod-pager .pg-dots{color:#5c646f !important}

/* dentro das caixas escuras o texto fraco tem de voltar a ser claro */
body.teste-branco .prod-filter .fsub,
body.teste-branco .prod-filter label,
body.teste-branco .filter-actions .filter-btn,
body.teste-branco .blp-paybar .bp-n{color:#c3c9d2 !important}
body.teste-branco .filter-actions .filter-btn{border-color:rgba(255,255,255,.28) !important}

/* barras e avisos que flutuam por cima da pagina */
body.teste-branco .blp-paybar,body.teste-branco .blp-promobar,
body.teste-branco .now,body.teste-branco .trax,
body.teste-branco .tracks-toggle,body.teste-branco .blp-lang-top,
body.teste-branco .blr-it,body.teste-branco .blr-cab,body.teste-branco .blr-tx{
  background:rgba(14,16,21,.96) !important}
body.teste-branco .blp-paybar .bp-t{color:#aeb5c0 !important}
body.teste-branco .blr-it .blr-ar{color:#c3c9d2 !important}

/* "Voltar ao menu" e afins, que assentam na pagina */
body.teste-branco .brand-cta{color:#0e1116 !important;border-color:#c9cfd8 !important}

/* ===== MODO BRANCO, 3.a passagem: dentro dos paineis que escureci, o texto
   fraco tinha ficado com o cinzento escolhido para o branco. Volta a claro.
   E o que ainda assenta mesmo na pagina passa a escuro. ===== */
body.teste-branco .mw-card .mw-cdesc,
body.teste-branco .veh-mq-tag,
body.teste-branco .grev-r p,body.teste-branco .sp-count,
body.teste-branco .partner-loc,body.teste-branco .partner-note,
body.teste-branco .blr-tx i,body.teste-branco .blr-cab span,
body.teste-branco .pv-head .pv-s{color:#b9c0ca !important}
body.teste-branco .mw-card .mw-cname,
body.teste-branco .grev-score b,body.teste-branco .sp-ig-head b,
body.teste-branco .partner-city,body.teste-branco .blr-tx b,
body.teste-branco .pv-head .pv-t{color:#f0f2f5 !important}

/* barra de paginas: ficou escura por fora e escura por dentro */
body.teste-branco .prod-pager{background:transparent !important}
body.teste-branco .prod-pager .pg-info{color:#2b313a !important}
body.teste-branco .prod-pager .pg-dots{color:#4a515c !important}

/* o dourado dentro de caixas escuras volta ao dourado da marca */
body.teste-branco .tracks-toggle span,
body.teste-branco .blr-cab b,
body.teste-branco .xlink{color:#F2C230 !important}

/* a barra de promocoes que flutua em cima da pagina */
body.teste-branco .blp-promobar,body.teste-branco .pb-wrap{
  background:rgba(14,16,21,.96) !important}
body.teste-branco .pb-tag,body.teste-branco .pb-cta{color:#F2C230 !important}
body.teste-branco .pb-x{color:#e6e8eb !important}
body.teste-branco .blp-lang-top{background:rgba(245,246,248,.97) !important}

/* o Tej (assistente) e as fichas que assentam na pagina */
body.teste-branco .tej-msg,body.teste-branco .tej-msg *,
body.teste-branco .co-tx,body.teste-branco .co-tx *,
body.teste-branco .bkm-tabs .bkm-tab{color:#1d222a !important}
body.teste-branco .co-tx b{color:#8a6a08 !important}
body.teste-branco .co-tx .co-ship{color:#4a515c !important}

/* a frase grande por baixo do titulo e da pagina, nao da caixa */
body.teste-branco .section-body>h2+.sec-count{
  background:transparent !important;color:#0a0b0d !important}

/* ===== MODO BRANCO, 4.a passagem: os ultimos, pelo nome real do bloco. ===== */

/* barra de promocoes e barra do Dyno: flutuam por cima da pagina */
body.teste-branco #promo-banner,
body.teste-branco #dyno-return-bar{background:rgba(14,16,21,.96) !important;
  border-color:rgba(255,255,255,.16) !important}
body.teste-branco #dyno-return-bar,
body.teste-branco #dyno-return-bar *{color:#e8eaee !important}
body.teste-branco #promo-banner .pb-tag,
body.teste-branco #promo-banner .pb-cta{color:#F2C230 !important}
body.teste-branco #promo-banner .pb-x{color:#e6e8eb !important}

/* o leitor de musica */
body.teste-branco #trax,body.teste-branco .trax-top,
body.teste-branco .now{background:rgba(14,16,21,.96) !important}
body.teste-branco .now .t{color:#f0f2f5 !important}
body.teste-branco .now .s{color:#b9c0ca !important}
body.teste-branco .trax-x{color:#d2d7de !important}

/* a barra de paginas vive dentro do .prod-block, que escureci: texto claro */
body.teste-branco .prod-pager .pg-info{color:#c3c9d2 !important}
body.teste-branco .prod-pager .pg-dots{color:#9aa2ad !important}

/* o separador Blacklist/outras marcas nos body kits */
body.teste-branco .bk-seg-toggle .bk-seg,
body.teste-branco .bk-seg-toggle .bk-seg *{color:#1d222a !important}
body.teste-branco .bk-seg-toggle .bk-seg[aria-pressed="true"],
body.teste-branco .bk-seg-toggle .bk-seg.on{background:#14171c !important}
body.teste-branco .bk-seg-toggle .bk-seg[aria-pressed="true"] *,
body.teste-branco .bk-seg-toggle .bk-seg.on *{color:#f0f2f5 !important}

/* o cabecalho do video de producao assenta na pagina, nao numa caixa */
body.teste-branco .prodvid .pv-head .pv-t{color:#0e1116 !important}
body.teste-branco .prodvid .pv-head .pv-s{color:#4a515c !important}

/* ligacoes douradas soltas na pagina (a gold nao se le em branco) */
body.teste-branco .section-body .xlink{color:#8a6a08 !important}
body.teste-branco .prod-filter .xlink,
body.teste-branco .prod-block .xlink{color:#F2C230 !important}

/* ===== MODO BRANCO, 5.a e ultima passagem ===== */
/* texto de introducao das categorias: assenta na pagina */
body.teste-branco .cat-intro,
body.teste-branco .cat-intro *{color:#1d222a !important}
body.teste-branco .cat-intro strong,
body.teste-branco .cat-intro b{color:#0e1116 !important}
/* ligacoes dentro das avaliacoes (cartao escuro) voltam ao dourado da marca */
body.teste-branco .sp-block .xlink,
body.teste-branco .grev-r .xlink{color:#F2C230 !important}
/* a frase grande fica sempre na pagina, nunca dentro de uma caixa escura */
body.teste-branco .section-body>h2+.sec-count{
  background:#fff !important;color:#0a0b0d !important;position:relative;z-index:2}

/* ===== O Braga (10/10/2026): a seccao abre de uma vez, nao aos pedacos.
   A revelacao e uma animacao com atraso: se o JavaScript nao chegar a tirar a
   classe, o CSS mostra o conteudo aos 2,4s na mesma. Nunca fica em branco. */
section.blp-montando>.section-body{opacity:0;animation:blpAbrirTudo .28s ease 2.4s forwards}
@keyframes blpAbrirTudo{from{opacity:0}to{opacity:1}}
section>.section-body{transition:opacity .28s ease}
@media(prefers-reduced-motion:reduce){
  section.blp-montando>.section-body{animation-duration:.01s;transition:none}
}

/* ===== O Braga (10/10/2026) =====
   1. O botao da bandeira volta ao que era. Eu tinha-o pintado de claro porque
      o medidor de contraste acusou o contorno preto do emoji - mas num emoji
      a cor do texto nao e a cor do desenho: era um falso alarme meu. */
body.teste-branco #blplang .blp-lang-top{
  background:rgba(0,0,0,.78) !important;border:1px solid #2a2e36 !important}
body.teste-branco #blplang .blp-lang-top:hover{border-color:#F2C230 !important}

/* 2. Fora a linha "Secure payment · all prices excl. VAT · 21% at checkout"
      do rodape das formas de pagamento. Os simbolos dos cartoes ficam. */
.blp-paybar .bp-n{display:none !important}

/* ===== O Braga (10/10/2026) =====
   1. O texto da pagina de cada marca estava escolhido para fundo escuro, e os
      destaques eram brancos: sobre o branco as palavras sumiam a meio da
      frase. Passa a um quadro cinzento escuro, como as outras caixas - assim
      o texto claro e os destaques brancos voltam a ler-se sem lhes tocar. */
body.teste-branco #vehm-story .vehm-text-f,
body.teste-branco .vehm-story2 .vehm-text-f{
  background:#262b36 !important;
  border:1px solid rgba(255,255,255,.14) !important;
  border-radius:14px !important;
  padding:24px 28px !important;
  box-shadow:0 14px 40px -26px rgba(0,0,0,.6)}
body.teste-branco #vehm-story .vehm-text-f p,
body.teste-branco #vehm-story .vehm-text-in{color:#e4e9f0 !important}
body.teste-branco #vehm-story .vehm-text-f strong,
body.teste-branco #vehm-story .vehm-text-f b{color:#ffffff !important}
/* o resto da pagina da marca assenta no branco */
body.teste-branco #cat-vehicle .vehm-head,
body.teste-branco #cat-vehicle .vehm-head *{color:#1d222a !important}
body.teste-branco #cat-vehicle .section-body>.eyebrow{color:#8a6a08 !important}
body.teste-branco #cat-vehicle .section-body>h2{color:#0e1116 !important}

/* 2. TESTE: o video que rodava por baixo das marcas subiu para a capa.
      Para o repor, basta apagar esta regra. */
.veh-midband{display:none !important}

/* ===== O Braga (10/10/2026): lista A-Z das marcas em pastilhas ============
   Substitui a grelha de cartoes grandes que esticava a pagina. Mesmo numero
   de marcas, uma fracao da altura. */
.vmk-lista{display:block !important;grid-template-columns:none !important;
  max-width:1100px;margin:22px auto 0;padding:0}
.vmk-grupo{display:flex;align-items:flex-start;gap:14px;
  padding:11px 0;border-top:1px solid rgba(0,0,0,.09)}
.vmk-grupo:first-child{border-top:0}
.vmk-letra{flex:0 0 26px;font:700 15px Oswald,sans-serif;line-height:30px;
  color:#8a6a08;text-align:center;letter-spacing:.5px}
.vmk-chips{display:flex;flex-wrap:wrap;gap:7px;flex:1 1 auto;min-width:0}
.vmk-chip{display:inline-flex;align-items:center;gap:7px;
  padding:6px 11px;border-radius:999px;
  background:#14171c;border:1px solid rgba(255,255,255,.14);
  text-decoration:none;cursor:pointer;
  transition:border-color .15s ease, background .15s ease, transform .1s ease}
.vmk-chip b{font:600 12.5px Oswald,sans-serif;letter-spacing:.4px;
  text-transform:uppercase;color:#f0f2f5;white-space:nowrap}
.vmk-chip i{font:500 11px Oswald,sans-serif;font-style:normal;color:#9aa2ad;
  font-variant-numeric:tabular-nums}
.vmk-chip:hover{background:#1d2128;border-color:var(--yellow,#F2C230);transform:translateY(-1px)}
.vmk-chip:hover b{color:#F2C230}
.vmk-chip:focus-visible{outline:2px solid var(--yellow,#F2C230);outline-offset:2px}
.vmk-outras b{color:#F2C230}
.vmk-nada{text-align:center;color:#4a515c;font:500 14px Oswald,sans-serif;padding:22px 0}
@media(max-width:640px){
  .vmk-lista{margin-top:16px}
  .vmk-grupo{gap:9px;padding:9px 0}
  .vmk-letra{flex:0 0 18px;font-size:13px;line-height:26px}
  .vmk-chip{padding:5px 9px;gap:5px}
  .vmk-chip b{font-size:11px}
  .vmk-chip i{font-size:10px}
}
/* no fundo escuro (modo ?branco=0) os riscos entre letras invertem-se */
body:not(.teste-branco) .vmk-grupo{border-top-color:rgba(255,255,255,.1)}
body:not(.teste-branco) .vmk-letra{color:#F2C230}
body:not(.teste-branco) .vmk-nada{color:#aeb5c0}

/* ===== O Braga (10/10/2026): o indice A-Z em colunas =====================
   Na primeira versao cada letra levava uma linha inteira da largura toda: o
   "K" gastava uma linha so para a Kia e sobrava meio ecra vazio a direita.
   Agora os grupos correm em tres colunas e a letra fica por cima das suas
   marcas. Mesma informacao, um terco da altura, e com cara de catalogo. */
.vmk-lista{
  columns:3;column-gap:34px;
  max-width:1100px;margin:20px auto 0;padding:0}
.vmk-grupo{
  display:block !important;
  break-inside:avoid;-webkit-column-break-inside:avoid;page-break-inside:avoid;
  border-top:0 !important;padding:0 0 15px !important;margin:0}
.vmk-letra{
  display:block;flex:none !important;
  font:700 12px Oswald,sans-serif;letter-spacing:2.5px;line-height:1 !important;
  color:#9aa2ad;text-align:left !important;
  padding:0 0 7px 2px;margin:0 0 7px;
  border-bottom:1px solid rgba(0,0,0,.1)}
.vmk-chips{gap:6px}
.vmk-chip{
  padding:5px 10px;border-radius:8px;
  background:#14171c;border:1px solid rgba(255,255,255,.1)}
.vmk-chip b{font-size:12px;letter-spacing:.3px}
.vmk-chip i{font-size:10.5px;color:#7f8792;padding-left:1px}
.vmk-chip:hover{background:#1d2128;border-color:var(--yellow,#F2C230)}
/* a pastilha "Other makes" fecha a lista, nao abre uma coluna so para ela */
.vmk-grupo:last-child{padding-bottom:0 !important}

@media(max-width:1024px){ .vmk-lista{columns:2;column-gap:26px} }
@media(max-width:640px){
  .vmk-lista{columns:1}
  .vmk-grupo{padding-bottom:13px !important}
  .vmk-chip{padding:5px 9px}
}
body:not(.teste-branco) .vmk-letra{color:#8d929b;border-bottom-color:rgba(255,255,255,.12)}

/* ===== O Braga (10/10/2026): as tres colunas passam a molduras ============
   Quadro cinzento, aro dourado, escrita branca e um risco a separar cada
   letra da seguinte. */
.vmk-lista{
  columns:auto !important;column-gap:normal !important;
  display:grid !important;grid-template-columns:repeat(3,1fr) !important;
  align-items:stretch;gap:18px !important;
  max-width:1160px;margin:22px auto 0;padding:0}
.vmk-col{
  background:#262b36;
  border:2px solid var(--yellow,#F2C230);border-radius:14px;
  padding:16px 16px 6px;min-width:0;
  box-shadow:0 12px 34px -22px rgba(242,194,48,.5)}
.vmk-vazia{display:none}
.vmk-grupo{
  display:block !important;border-top:0 !important;
  padding:0 0 12px !important;margin:0 0 12px;
  border-bottom:1px solid rgba(255,255,255,.14)}
.vmk-col .vmk-grupo:last-child{border-bottom:0;margin-bottom:0;padding-bottom:2px !important}
.vmk-letra{
  display:block;flex:none !important;
  font:700 11.5px Oswald,sans-serif;letter-spacing:2.6px;line-height:1 !important;
  color:#F2C230 !important;text-align:left !important;
  padding:0 0 8px 1px;margin:0;border-bottom:0}
.vmk-chips{gap:6px}
.vmk-chip{
  padding:5px 10px;border-radius:8px;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12)}
.vmk-chip b{font-size:12px;letter-spacing:.3px;color:#ffffff}
.vmk-chip i{font-size:10.5px;color:#aab1bb}
.vmk-chip:hover{background:rgba(242,194,48,.16);border-color:var(--yellow,#F2C230)}
.vmk-chip:hover b{color:#F2C230}

@media(max-width:1024px){ .vmk-lista{grid-template-columns:repeat(2,1fr) !important;gap:14px !important} }
@media(max-width:640px){
  .vmk-lista{grid-template-columns:1fr !important;gap:12px !important;margin-top:16px}
  .vmk-col{padding:13px 13px 5px;border-radius:12px}
  .vmk-chip{padding:5px 9px}
}

/* ===== O Braga (10/10/2026): a caixa dos produtos encurtada ===============
   TESTE: cinco colunas no computador em vez de quatro. Com 40 produtos por
   pagina, cinco colunas dao exatamente oito filas - a caixa mostra a pagina
   inteira sem esticar o site. O travao das oito filas fica na mesma, para
   quando uma lista trouxer mais. */
@media(min-width:1025px){
  .prod-grid{grid-template-columns:repeat(5,1fr) !important;gap:12px !important}
}
/* a caixa arrasta-se por dentro, com barra dourada, e avisa que ha mais */
.prod-table-wrap.rola-dentro{position:relative}
.prod-table-wrap.rola-dentro::after{
  content:"";position:sticky;bottom:0;left:0;display:block;height:34px;margin-top:-34px;
  pointer-events:none;
  background:linear-gradient(to top, rgba(10,12,16,.92), rgba(10,12,16,0))}

/* Com cinco colunas o cartao fica estreito e a descricao desdobrava-se em
   seis ou sete linhas: as filas mediam 422px e a pagina continuava enorme.
   A foto ganha proporcao fixa e o nome corta nas tres linhas, como ja fazia
   no telemovel. Assim as filas ficam todas do mesmo tamanho. */
@media(min-width:1025px){
  .prod-grid>.prod-card{min-width:0;overflow:hidden}
  .prod-card .pc-ph{aspect-ratio:4/3;height:auto !important;min-height:0}
  .prod-card .pc-ph img{width:100%;height:100%;object-fit:cover}
  .prod-card .pc-body{padding:12px 12px 13px !important;min-width:0}
  .prod-card .pc-body>*{min-width:0;max-width:100%}
  .prod-card .pc-brand{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .prod-card .pc-code{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .prod-card .pc-name{font-size:13px !important;line-height:17px !important;
    display:-webkit-box !important;-webkit-line-clamp:3 !important;
    -webkit-box-orient:vertical !important;
    overflow:hidden !important;min-height:0 !important;max-height:51px !important}
  .prod-card .pc-stock{display:-webkit-box;-webkit-line-clamp:1;
    -webkit-box-orient:vertical;overflow:hidden}
  .prod-card .pc-price{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .prod-card .pc-btns{padding-top:9px !important;gap:6px}
  .prod-card .pc-add,.prod-card .pc-view{font-size:12px !important;padding:9px 6px !important;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  @supports (content-visibility:auto){
    .prod-card{contain-intrinsic-size:auto 330px}
  }
}

/* ===== O Braga (10/10/2026): a moldura do carrossel das marcas ============
   As bordas dos lados nao existiam e as de cima e de baixo mal se viam: a
   faixa tinha uma mascara que desvanecia as pontas (-webkit-mask-image), e
   ela apagava tambem o aro e desfocava as primeiras e ultimas marcas.
   Fora a mascara, aro de 3px fechado nos quatro lados. */
#cat-vehicles .veh-marquee,#homeveh .veh-marquee,.veh-marquee{
  -webkit-mask-image:none !important;mask-image:none !important;
  border:3px solid var(--yellow,#F2C230) !important;
  border-radius:14px !important;
  overflow:hidden !important;
  box-shadow:0 12px 34px -20px rgba(242,194,48,.55) !important}
/* as outras molduras douradas do site ficam da mesma grossura */
.mw-list,.mw-cardrow,.brand-carousel{border-width:3px !important}
.prod-filter{border-width:3px !important}
.prod-table-wrap{border-width:3px !important}
.vmk-col{border-width:3px !important}
/* a mesma mascara estava tambem no carrossel que anda sozinho (.blq-on):
   era ela que desfocava a primeira e a ultima marca dentro da moldura */
.veh-marquee.blq-on,.veh-marquee .blq-on,
#cat-vehicles .blq-on,#homeveh .blq-on{
  -webkit-mask-image:none !important;mask-image:none !important}

/* O Braga (10/10/2026): as tres molduras A-Z a preto em vez do cinzento. */
.vmk-col{background:#08090b !important}
.vmk-chip{background:rgba(255,255,255,.085) !important;
  border-color:rgba(255,255,255,.16) !important}
.vmk-grupo{border-bottom-color:rgba(255,255,255,.16) !important}

/* ===== O Braga (10/10/2026): o indice de modelos a preto =================
   Os cartoes eram cinzento-escuro com o texto dos modelos em cinzento claro:
   lia-se mal. Ficam pretos, com o nome do modelo a branco. */
.vmi-group{background:#08090b !important;
  border:1px solid rgba(255,255,255,.14) !important;border-radius:14px !important}
.vmi-group .vmi-head{color:#ffffff !important;
  border-bottom:1px solid rgba(255,255,255,.16) !important}
.vmi-group .vmi-head span{color:#F2C230 !important}
.vmodel-chip{background:rgba(255,255,255,.085) !important;
  border:1px solid rgba(255,255,255,.16) !important;
  color:#ffffff !important;border-radius:8px !important}
.vmodel-chip:hover{background:rgba(242,194,48,.16) !important;
  border-color:var(--yellow,#F2C230) !important;color:#F2C230 !important}

/* ===== O Braga (10/10/2026): "Shop by model" no formato C3 ================
   Faixa dourada grossa no topo, trilho das marcas a esquerda separado por um
   risco dourado, painel dos modelos a direita. Aros de 4px: ele queria tudo
   mais grosso, a separar melhor as coisas. */
.vmx{max-width:1160px;margin:22px auto 0;
  background:#08090b;
  border:4px solid var(--yellow,#F2C230);border-radius:16px;overflow:hidden;
  box-shadow:0 16px 44px -24px rgba(242,194,48,.55)}
.vmx-cab{display:flex;align-items:center;gap:12px;
  background:var(--yellow,#F2C230);color:#121212;
  padding:14px 22px;
  font:700 13px Oswald,sans-serif;letter-spacing:3px;text-transform:uppercase;
  border-bottom:4px solid #0a0b0d}
.vmx-cab span{margin-left:auto;font-weight:600;letter-spacing:1.6px;font-size:11.5px;
  font-variant-numeric:tabular-nums}
.vmx-corpo{display:grid;grid-template-columns:252px 1fr;min-height:330px}
.vmx-rail{display:flex;flex-direction:column;gap:3px;
  padding:12px 10px;background:#08090b;
  border-right:4px solid var(--yellow,#F2C230);
  max-height:430px;overflow-y:auto;
  scrollbar-width:thin;scrollbar-color:var(--yellow,#F2C230) transparent}
.vmx-rail::-webkit-scrollbar{width:9px}
.vmx-rail::-webkit-scrollbar-thumb{background:rgba(242,194,48,.6);border-radius:8px}
.vmx-rail::-webkit-scrollbar-track{background:transparent}
.vmx-m{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:9px;
  color:#b9c0ca;cursor:pointer;text-decoration:none;
  border-left:4px solid transparent;
  transition:background .14s ease,color .14s ease}
.vmx-m b{font:600 12px Oswald,sans-serif;letter-spacing:1.3px;text-transform:uppercase;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.vmx-m i{margin-left:auto;font-style:normal;font-size:10.5px;color:#7f8792;
  font-variant-numeric:tabular-nums}
.vmx-lg{width:26px;height:18px;flex:0 0 auto;background:#fff;border-radius:3px;
  object-fit:contain;padding:1px}
.vmx-sem{background:rgba(255,255,255,.18)}
.vmx-m:hover{background:rgba(255,255,255,.06);color:#fff}
.vmx-m.on{background:#262b36;color:#fff;border-left-color:var(--yellow,#F2C230)}
.vmx-m.on i{color:#c3c9d2}
.vmx-pan{padding:18px 22px 22px;min-width:0}
.vmx-tt{font:700 21px Oswald,sans-serif;letter-spacing:1.8px;text-transform:uppercase;
  color:#fff;margin:0 0 3px}
.vmx-sb{font:500 11.5px Oswald,sans-serif;letter-spacing:.5px;color:#9aa2ad;
  margin-bottom:15px;padding-bottom:13px;
  border-bottom:2px solid rgba(242,194,48,.35)}
.vmx-chips{display:flex;flex-wrap:wrap;gap:7px}
.vmx-chip{display:inline-flex;align-items:center;
  background:#262b36;border:2px solid rgba(255,255,255,.16);border-radius:9px;
  color:#fff;padding:7px 11px;font:500 11.5px Oswald,sans-serif;letter-spacing:.3px;
  text-decoration:none;cursor:pointer;
  transition:background .14s ease,border-color .14s ease,color .14s ease}
.vmx-chip:hover{background:rgba(242,194,48,.16);border-color:var(--yellow,#F2C230);color:#F2C230}
.vmx-mais{display:inline-flex;align-items:center;padding:7px 11px;
  font:500 11.5px Oswald,sans-serif;color:#8a8f98;letter-spacing:.4px}

@media(max-width:860px){
  .vmx-corpo{grid-template-columns:1fr}
  .vmx-rail{flex-direction:row;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;
    max-height:none;border-right:0;border-bottom:4px solid var(--yellow,#F2C230);
    padding:11px 10px}
  .vmx-m{flex:0 0 auto;border-left:0;border-bottom:4px solid transparent;border-radius:8px}
  .vmx-m.on{border-left:0;border-bottom-color:var(--yellow,#F2C230)}
  .vmx-m i{margin-left:6px}
  .vmx-cab{padding:12px 15px;font-size:11.5px;letter-spacing:2px}
  .vmx-cab span{font-size:10.5px}
  .vmx-pan{padding:15px 15px 18px}
  .vmx-tt{font-size:18px}
}
/* altura fixa a serio: o painel dos modelos tambem arrasta por dentro.
   A BMW tem 120 modelos - sem isto o quadro ia aos 1575px. */
.vmx-corpo{max-height:440px}
.vmx-rail{max-height:440px}
.vmx-pan{max-height:440px;overflow-y:auto;
  scrollbar-width:thin;scrollbar-color:var(--yellow,#F2C230) transparent}
.vmx-pan::-webkit-scrollbar{width:9px}
.vmx-pan::-webkit-scrollbar-thumb{background:rgba(242,194,48,.6);border-radius:8px}
.vmx-pan::-webkit-scrollbar-track{background:transparent}
.vmx-sb{position:sticky;top:0;background:#08090b;z-index:2;padding-top:2px}
.vmx-tt{position:sticky;top:0;background:#08090b;z-index:2}
@media(max-width:860px){
  .vmx-corpo{max-height:none}
  .vmx-rail{max-height:none}
  .vmx-pan{max-height:400px}
}
/* o contentor ainda tinha a grelha dos cartoes antigos e espremia o quadro
   novo para uma coluna de 350px */
#veh-modelindex{display:block !important;grid-template-columns:none !important;
  gap:0 !important;max-width:none !important}

/* ===== O Braga (10/10/2026): capa em video no topo do Catalogo ============
   A faixa entra no fluxo, antes do corpo. O corpo deixa de precisar do
   espaco que tinha para nao passar por baixo do cabecalho fixo - agora e a
   faixa que fica la em cima, e o cabecalho sobrepoe-se a ela como no
   "Find Your Application". */
#catalog.tem-capa-video .section-body{padding-top:0 !important}
#catalog #catalog-capa{margin-bottom:0}
/* a faixa estava absoluta e passava por cima do titulo: entra no fluxo,
   como no "Find Your Application" */
#catalog #catalog-capa{position:static !important;
  aspect-ratio:1920/400 !important;height:auto !important;
  width:100%;max-width:100%;margin:0;overflow:hidden;line-height:0}
#catalog #catalog-capa .capa-vid{position:absolute;inset:0;
  width:100%;height:100%;object-fit:cover;display:block}
#catalog #catalog-capa{position:relative !important}
#catalog #catalog-capa::after{display:none}
/* de ponta a ponta, como a faixa do "Find Your Application" */
#catalog #catalog-capa{width:100vw !important;max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important;margin-right:calc(50% - 50vw) !important}

/* ===== O Braga (10/10/2026): os dois riscos da faixa do titulo com a mesma
   grossura, e grossos como os outros aros do site. */
.tem-faixa-video .tit-video{
  border-top:4px solid var(--yellow,#F2C230) !important;
  border-bottom:4px solid var(--yellow,#F2C230) !important}

/* ===== O Braga (10/10/2026): a frase do catalogo entra a ser pintada ======
   Nao e letra a letra como uma maquina de escrever - e uma passagem da
   esquerda para a direita, como uma lata de spray a atravessar a parede.
   A mascara tem a ponta esfumada, por isso a letra nasce em vez de ser
   cortada a regua. Nao mexe no espaco ocupado, portanto a medicao que
   ajusta o tamanho da letra continua certa. */
.sec-count.pinta{
  position:relative;
  -webkit-mask-image:linear-gradient(90deg,#000 0 49%,rgba(0,0,0,.45) 50%,rgba(0,0,0,0) 51.5%);
          mask-image:linear-gradient(90deg,#000 0 49%,rgba(0,0,0,.45) 50%,rgba(0,0,0,0) 51.5%);
  -webkit-mask-size:200% 100%;         mask-size:200% 100%;
  -webkit-mask-repeat:no-repeat;       mask-repeat:no-repeat;
  -webkit-mask-position:100% 0;        mask-position:100% 0;
  animation:blpSpray 1.5s cubic-bezier(.25,.6,.35,1) .18s forwards}
@keyframes blpSpray{
  from{-webkit-mask-position:100% 0;  mask-position:100% 0}
  to  {-webkit-mask-position:-10% 0;  mask-position:-10% 0}
}
/* o rasto humido da tinta, a correr na ponta da escrita */
.sec-count.pinta::after{
  content:"";position:absolute;top:-10%;bottom:-10%;width:54px;left:0;
  pointer-events:none;border-radius:50%;
  background:radial-gradient(58% 50% at 50% 50%,rgba(242,194,48,.75),rgba(242,194,48,0) 72%);
  filter:blur(6px);opacity:0;
  animation:blpSprayPonta 1.5s cubic-bezier(.25,.6,.35,1) .18s forwards}
@keyframes blpSprayPonta{
  0%  {left:-5%;opacity:0}
  10% {opacity:1}
  86% {opacity:1}
  100%{left:100%;opacity:0}
}
@media(prefers-reduced-motion:reduce){
  .sec-count.pinta{-webkit-mask-image:none;mask-image:none;animation:none}
  .sec-count.pinta::after{display:none}
}

/* ===== O Braga (10/10/2026): o preto por baixo da capa no "Find Your
   Application" estava grande demais ======================================
   A capa estava solta (absoluta) por cima de um corpo que guardava
   289px de espaco para ela. Sobravam ~69px de preto vazio, e a faixa do
   titulo esticava-se para os tapar em vez de o titulo subir. Agora a capa
   entra no fluxo e o corpo deixa de guardar esse espaco - exactamente o
   que ja se fez no Catalogo. O titulo sobe, a faixa fica com a altura
   natural, e o preto desaparece. */
#cat-vehicles .section-body{padding-top:0 !important}
#cat-vehicles #veh-capa{position:relative !important;
  aspect-ratio:1920/400 !important;height:auto !important;
  margin-top:0;margin-bottom:0;overflow:hidden;line-height:0}
#cat-vehicles #veh-capa .capa-vid{position:absolute;inset:0;
  width:100%;height:100%;object-fit:cover;display:block}
#cat-vehicles #veh-capa::after{display:none}
/* de ponta a ponta, como no Catalogo */
#cat-vehicles #veh-capa{width:100vw !important;max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important;margin-right:calc(50% - 50vw) !important}

/* ===== O Braga (10/10/2026): as duas riscas douradas pareciam diferentes ===
   Medi as duas no teu proprio ecra: tem as duas 4px, exactamente iguais.
   O que muda e o que esta de cada lado. A de cima tem preto em cima e preto
   em baixo; a de baixo tem preto em cima e a pagina branca em baixo, e o
   dourado contra o branco perde um dos contornos - o olho le-a mais fina.
   Solucao: por um fio escuro por baixo do dourado, para a risca de baixo
   ficar fechada dos dois lados como a de cima. No fundo escuro nao se ve;
   no fundo claro e o que faz as duas ficarem iguais. */
.tem-faixa-video .tit-video{
  box-shadow:0 4px 0 0 #0b0c0e !important}

/* ===== O Braga (10/10/2026): barra de pesquisa dentro do "Shop by model" ==
   Fica entre a faixa dourada e o corpo, com os mesmos aros grossos do resto
   do quadro. A lupa e o x ficam dentro do campo. */
.vmx-busca{position:relative;display:flex;align-items:center;
  background:#101217;border-bottom:4px solid var(--yellow,#F2C230);
  padding:0 16px}
.vmx-lupa{width:19px;height:19px;flex:0 0 auto;fill:var(--yellow,#F2C230);opacity:.85}
.vmx-busca input{flex:1 1 auto;min-width:0;
  background:transparent;border:0;outline:0;color:#fff;
  font:500 14px Oswald,sans-serif;letter-spacing:.6px;
  padding:14px 10px;-webkit-appearance:none;appearance:none}
.vmx-busca input::placeholder{color:#767d88;letter-spacing:.5px}
.vmx-busca input::-webkit-search-cancel-button{display:none}
.vmx-busca input:focus{color:#fff}
.vmx-busca:focus-within{background:#161922}
.vmx-x{flex:0 0 auto;display:none;background:transparent;border:0;cursor:pointer;
  color:#9aa2ad;font-size:22px;line-height:1;padding:4px 6px;border-radius:7px}
.vmx-x:hover{color:#F2C230;background:rgba(242,194,48,.12)}
.vmx-filtrado .vmx-x{display:block}
/* quando ha pesquisa a correr, a conta no topo passa a ser o resultado */
.vmx-filtrado .vmx-cab span{color:#121212;font-weight:700}
.vmx-nada{padding:16px 11px;color:#8a8f98;
  font:500 12px Oswald,sans-serif;letter-spacing:1px;text-transform:uppercase}
.vmx-vazio{padding:26px 22px;color:#9aa2ad;
  font:400 14px/1.6 Oswald,sans-serif;letter-spacing:.4px}
.vmx-vazio b{color:#F2C230;font-weight:600}
@media(max-width:760px){
  .vmx-busca{padding:0 13px}
  .vmx-busca input{font-size:16px;padding:12px 9px}  /* 16px: o iPhone nao da zoom */
}
/* com poucos resultados o quadro nao precisa de ficar com a altura toda */
.vmx-filtrado .vmx-corpo{min-height:0}
.vmx-filtrado .vmx-rail,.vmx-filtrado .vmx-pan{max-height:440px}

/* aviso de filtro que caiu por nao existir no grupo novo */
.blp-caiu{margin:8px 0 0;padding:8px 12px;border-radius:9px;
  background:rgba(242,194,48,.12);border:1px solid rgba(242,194,48,.45);
  color:#F2C230;font:500 12px Oswald,sans-serif;letter-spacing:.4px}
body.teste-branco .blp-caiu{background:#fff8e2;border-color:#e2b93a;color:#7a5c00}

/* ===== O Braga (11/10/2026): TESTE - abertura em preto com a frase pintada
   A letra e a Permanent Marker, que o site ja carrega para o logo. Sozinha e
   fina demais para o grafite do video, por isso leva um contorno da propria
   cor: fica gorda e redonda como uma tag feita a lata. O brilho branco por
   tras e o mesmo halo que a frase tem no video.
   A mascara corre por LINHA, nao por palavra: por palavra via-se o rectangulo
   de cada uma a cortar o brilho. A linha leva folga a toda a volta para o
   brilho caber dentro da mascara. */
#blp-tagwall{position:fixed;inset:0;z-index:2147483647;
  background:#000;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:clamp(2px,.8vw,12px);padding:0 4vw;cursor:pointer;
  transition:opacity .46s ease}
#blp-tagwall.sai{opacity:0;pointer-events:none}
html.abertura-tag{overflow:hidden}
html.abertura-tag #intro-vid{display:none !important}

#blp-tagwall .tw-linha{
  font-family:"Permanent Marker",cursive;
  font-size:clamp(32px,8.2vw,124px);line-height:1.06;
  text-transform:uppercase;white-space:nowrap;color:#ececeb;
  /* folga para o brilho caber dentro da mascara - o neon e grande */
  padding:.46em .34em;
  /* O Braga (11/10/2026): neon. O miolo da letra fica branco quente, o
     contorno e o halo sao o vermelho do logo (#D21F1F). O contorno e
     pintado por baixo do miolo (paint-order), por isso ve-se so o aro
     vermelho a toda a volta - e o tubo de neon. */
  /* a forma abreviada com clamp() nao e aceite e a regra caia toda - o
     contorno ficava da cor do texto. Separado funciona. */
  -webkit-text-stroke-width:clamp(2.5px,.56vw,8px);
  -webkit-text-stroke-color:var(--red,#D21F1F);
  paint-order:stroke fill;
  text-shadow:
    0 0 5px  rgba(255,255,255,.98),
    0 0 11px rgba(255,190,190,.92),
    0 0 22px rgba(210,31,31,.90),
    0 0 44px rgba(210,31,31,.66),
    0 0 86px rgba(210,31,31,.40),
    0 0 150px rgba(210,31,31,.22);
  /* entra a ser pintada da esquerda para a direita */
  /* A mascara tem 3x a largura da linha e a parte cheia ocupa 40% dela,
     ou seja 1,2x a linha: so assim ela chega a tapar a linha toda no fim.
     Com 214% a parte cheia media 0,98x e as primeiras letras ficavam
     cortadas para sempre - foi o que aconteceu a primeira vez.
     Vai de 64% (tudo escondido) a 0% (tudo pintado). */
  -webkit-mask-image:linear-gradient(90deg,#000 0 40%,rgba(0,0,0,.38) 42%,rgba(0,0,0,0) 44%);
          mask-image:linear-gradient(90deg,#000 0 40%,rgba(0,0,0,.38) 42%,rgba(0,0,0,0) 44%);
  -webkit-mask-size:300% 100%;    mask-size:300% 100%;
  -webkit-mask-repeat:no-repeat;  mask-repeat:no-repeat;
  -webkit-mask-position:64% 0;    mask-position:64% 0;
  opacity:0;
  animation:twPinta 1.25s cubic-bezier(.3,.62,.36,1) var(--atraso,0s) forwards,
            twAcende 1.1s steps(1,end) calc(var(--atraso,0s) + 1.05s) 1 both}
/* o neon a pegar: dois estalos curtos e depois fica aceso, como um tubo
   velho a arrancar */
@keyframes twAcende{
  0%  {filter:brightness(1)}
  9%  {filter:brightness(.42)}
  15% {filter:brightness(1.22)}
  24% {filter:brightness(.55)}
  31% {filter:brightness(1.12)}
  38% {filter:brightness(.82)}
  46% {filter:brightness(1.06)}
  100%{filter:brightness(1)}
}
#blp-tagwall .tw-l0{transform:rotate(-1.5deg)}
#blp-tagwall .tw-l1{transform:rotate(1deg)}
@keyframes twPinta{
  0%  {opacity:1;-webkit-mask-position:64% 0; mask-position:64% 0}
  100%{opacity:1;-webkit-mask-position:0% 0;  mask-position:0% 0}
}
@media(max-width:560px){
  #blp-tagwall .tw-linha{font-size:clamp(26px,10.2vw,54px)}
}
@media(prefers-reduced-motion:reduce){
  #blp-tagwall .tw-linha{animation:none;opacity:1;
    -webkit-mask-image:none;mask-image:none}
}

/* ===== O Braga (11/10/2026): a tabela da BLACKLIST ======================
   Estava branca com cabecalho cor-de-rosa e os @ do Instagram desalinhados -
   uns ao lado do nome, outros por baixo, conforme o nome fosse comprido.
   Passa a ser um quadro ESCURO com aro dourado, igual ao quadro do filtro do
   catalogo: faixa dourada no topo com letra preta, linhas escuras, o lugar e
   a velocidade a dourado. O @ fica SEMPRE por baixo do nome, por isso ficam
   todos alinhados uns com os outros.
   Leva !important porque o modo claro gerou regras para estes elementos. */
#cat-blacklist .bl-tblwrap{
  background:#08090b !important;
  border:4px solid var(--yellow,#F2C230) !important;
  border-radius:16px !important;
  overflow:hidden !important;
  box-shadow:0 16px 44px -24px rgba(242,194,48,.55) !important}
#cat-blacklist .bl-tbl{background:transparent !important;border-collapse:collapse !important}

/* faixa dourada do cabecalho, como no "Shop by model" */
#cat-blacklist .bl-tbl thead th{
  background:var(--yellow,#F2C230) !important;
  color:#121212 !important;
  font:700 11px Oswald,sans-serif !important;
  letter-spacing:2px !important;text-transform:uppercase !important;
  padding:13px 14px !important;
  border:0 !important;border-bottom:4px solid #0a0b0d !important;
  white-space:nowrap}

/* linhas */
#cat-blacklist .bl-tbl tbody td{
  background:transparent !important;
  color:#e7eaef !important;
  border-top:1px solid rgba(255,255,255,.09) !important;
  padding:13px 14px !important;vertical-align:middle !important}
#cat-blacklist .bl-tbl tbody tr:nth-child(even) td{background:rgba(255,255,255,.028) !important}
#cat-blacklist .bl-tbl tbody tr:hover td{background:rgba(242,194,48,.08) !important}
/* os tres primeiros ganham um fundo dourado ao de leve */
#cat-blacklist .bl-tbl tr.top15 td{background:rgba(242,194,48,.055) !important}
#cat-blacklist .bl-tbl tr.top15:nth-child(even) td{background:rgba(242,194,48,.085) !important}
#cat-blacklist .bl-tbl tr.mine td{background:rgba(242,194,48,.14) !important}
/* o lugar e a velocidade sao o que interessa: ficam a dourado e grandes */
#cat-blacklist .bl-tbl td.bl-rk{
  font-family:'Racing Sans One',sans-serif !important;
  color:var(--yellow,#F2C230) !important;font-size:20px !important;width:52px !important}
#cat-blacklist .bl-tbl td.bl-rk.top1{color:#ffd700 !important}
#cat-blacklist .bl-tbl td.bl-rk.top2{color:#d7dae0 !important}
#cat-blacklist .bl-tbl td.bl-rk.top3{color:#e09a4e !important}
#cat-blacklist .bl-tbl td.bl-sp{
  font-family:'Racing Sans One',sans-serif !important;
  color:var(--yellow,#F2C230) !important;font-size:19px !important;white-space:nowrap}
/* as colunas de apoio ficam mais calmas, para nao competir */
#cat-blacklist .bl-tbl td.bl-hidem{color:#aeb6c1 !important;font-size:13px !important}

/* ---- o nome e os @: sempre em duas linhas, por isso alinham todos ---- */
/* o nome fica em bloco para a estrela ficar ao lado dele, e os @ passam a
   ser uma linha propria por baixo - assim alinham todos uns com os outros */
#cat-blacklist .bl-gt{
  display:block !important;
  font:600 14px Oswald,sans-serif !important;color:#fff !important;
  letter-spacing:.4px;line-height:1.35}
#cat-blacklist .bl-socs{
  display:flex !important;flex-wrap:wrap !important;gap:6px !important;
  margin:7px 0 0 !important;vertical-align:baseline !important}
#cat-blacklist .bl-star{
  display:inline-block !important;font-size:15px !important;
  margin-right:7px !important;vertical-align:baseline !important}
/* o @ deixa de ser cor-de-rosa: pastilha escura com aro, como o resto do
   site. A cor da rede so aparece quando se passa por cima. */
#cat-blacklist .bl-soc{
  background:rgba(255,255,255,.07) !important;
  border:1px solid rgba(255,255,255,.22) !important;
  color:#dfe4ec !important;
  padding:4px 10px !important;border-radius:999px !important;
  font:500 11px Oswald,sans-serif !important;letter-spacing:.6px}
#cat-blacklist .bl-soc:hover{border-color:var(--yellow,#F2C230) !important;color:#fff !important}
#cat-blacklist .bl-soc.ig:hover{background:#e1306c !important;border-color:#e1306c !important}
#cat-blacklist .bl-soc.yt:hover{background:#f00 !important;border-color:#f00 !important}
#cat-blacklist .bl-soc.tt:hover{background:#25f4ee !important;border-color:#25f4ee !important;color:#0b0d11 !important}
#cat-blacklist .bl-soc.site:hover{background:var(--yellow,#F2C230) !important;border-color:var(--yellow,#F2C230) !important;color:#141414 !important}

/* no telemovel a tabela vira lista: mantem-se escura e com o mesmo aro */
@media(max-width:760px){
  #cat-blacklist .bl-tbl tr{border-top:1px solid rgba(255,255,255,.09) !important}
  #cat-blacklist .bl-tbl td:nth-child(n+4){color:#aeb6c1 !important}
}

/* ===== O Braga (11/10/2026): o aviso "Want to compete" estava ilegivel ====
   A letra e #e7e7e7 - feita para fundo escuro. No modo claro o quadro ficou
   creme e o texto desapareceu dentro dele. Passa a ser um cartao escuro com
   aro dourado, como a tabela ao lado, e a letra volta a ler-se. */
#cat-blacklist .bl-notice{
  background:#0b0d11 !important;
  border:3px solid var(--yellow,#F2C230) !important;
  border-radius:14px !important;
  padding:18px 24px !important;
  box-shadow:0 14px 36px -22px rgba(242,194,48,.55) !important}
#cat-blacklist .bl-notice-in{
  color:#e9edf3 !important;font-size:14.5px !important;line-height:1.65 !important}
#cat-blacklist .bl-notice-in b{color:var(--yellow,#F2C230) !important;font-weight:700 !important}
/* "Blacklist rank" no meio da frase tem de saltar a vista: e o que se clica */
#cat-blacklist .bl-notice-in a,
#cat-blacklist .bl-notice-in strong{
  color:var(--yellow,#F2C230) !important;font-weight:700 !important;
  text-decoration:underline !important;text-underline-offset:3px !important}
#cat-blacklist .bl-notice-btn{
  background:var(--red,#D21F1F) !important;color:#fff !important;
  border:2px solid transparent !important;
  padding:13px 26px !important;border-radius:10px !important;
  font-family:'Racing Sans One',cursive !important;letter-spacing:.6px !important;
  box-shadow:0 10px 26px -14px rgba(210,31,31,.9) !important}
#cat-blacklist .bl-notice-btn:hover{
  filter:brightness(1.1) !important;border-color:var(--yellow,#F2C230) !important}

/* ===== O Braga (11/10/2026): "Top Speed Ranking" era dourado em cima do
   fundo claro - nao se lia. Passa a uma faixa propria: letra escura e forte,
   com um risco dourado por baixo, para continuar a ser o dourado da casa sem
   desaparecer. */
#cat-blacklist .bl-h{
  display:block !important;
  text-align:center !important;
  color:#11141a !important;
  font:700 26px 'Racing Sans One',sans-serif !important;
  letter-spacing:1.2px !important;text-transform:uppercase !important;
  margin:0 auto 16px !important;padding:0 0 10px !important;
  max-width:max-content !important;
  border-bottom:4px solid var(--yellow,#F2C230) !important}
#cat-blacklist .bl-sub2{
  text-align:center !important;color:#4b535f !important;
  font-size:13.5px !important;margin:0 0 16px !important}
/* se algum dia a pagina voltar ao fundo escuro, a letra acompanha */
body:not(.teste-branco) #cat-blacklist .bl-h{color:#fff !important}
body:not(.teste-branco) #cat-blacklist .bl-sub2{color:#9aa0aa !important}

/* ===== O Braga (11/10/2026): "Only the fastest make the list" em neon =====
   Num fundo claro um brilho branco nao se ve, por isso a frase assenta numa
   placa escura - como um reclame de neon montado na parede. Letra branca,
   tubo vermelho do logo a toda a volta e o halo por tras. */
#cat-blacklist .sec-count.bl-neon{
  display:inline-block !important;
  background:#07080a !important;
  border:3px solid rgba(210,31,31,.55) !important;
  border-radius:16px !important;
  padding:.22em .6em .3em !important;
  margin:6px auto 22px !important;
  max-width:calc(100% - 24px) !important;
  color:#fff !important;
  -webkit-text-stroke-width:2.5px;
  -webkit-text-stroke-color:var(--red,#D21F1F);
  paint-order:stroke fill;
  text-shadow:
    0 0 5px  rgba(255,255,255,.95),
    0 0 12px rgba(255,190,190,.9),
    0 0 26px rgba(210,31,31,.9),
    0 0 52px rgba(210,31,31,.62),
    0 0 96px rgba(210,31,31,.34) !important;
  box-shadow:0 0 0 1px rgba(210,31,31,.25),
             0 18px 46px -26px rgba(210,31,31,.85) !important}
/* a placa e o texto ficam centrados na pagina */
#cat-blacklist .section-body{text-align:center}
@media(max-width:640px){
  #cat-blacklist .sec-count.bl-neon{
    padding:.2em .45em .26em !important;border-width:2px !important;
    -webkit-text-stroke-width:1.6px}
}

/* ===== O Braga (11/10/2026): a faixa que roda colada ao banner do titulo ==
   A faixa ia de 80 a 1432 (tinha o recuo da pagina) e entre ela e o banner
   do titulo havia 88px de branco. Agora a faixa vai de ponta a ponta e o
   banner encosta-se-lhe por baixo, como no catalogo. */
#cat-blacklist .bl-marquee{
  width:100vw !important;max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;
  padding-top:9px !important;padding-bottom:9px !important;
  background:#07080a !important}
/* o corpo deixa de guardar o espaco que empurrava o titulo para baixo */
#cat-blacklist .section-body{padding-top:0 !important}
/* e por baixo do banner abre-se ar antes da placa de neon */
#cat-blacklist .sec-count.bl-neon{margin-top:52px !important;margin-bottom:38px !important}

/* ===== O Braga (11/10/2026): 5 estrelas de "procurado" com luz de sirene ==
   No canto da faixa do titulo. A barra de luzes por tras pisca azul/vermelho
   como um carro da policia, e as estrelas acendem uma a seguir a outra, da
   esquerda para a direita, como o nivel de procurado a subir. */
#cat-blacklist .tit-video{position:relative}
#cat-blacklist .blw{
  position:absolute;right:clamp(14px,2.4vw,34px);top:50%;
  transform:translateY(-50%);
  display:flex;align-items:center;gap:10px;
  padding:9px 14px;border-radius:12px;
  background:rgba(4,5,7,.72);
  border:2px solid rgba(242,194,48,.5);
  backdrop-filter:blur(3px);
  pointer-events:none;z-index:4}
/* a barra de luzes: duas metades, uma azul e uma vermelha, a alternar */
#cat-blacklist .blw-rot{position:relative;display:block;width:30px;height:11px;
  border-radius:4px;overflow:hidden;background:#0b0d11;
  border:1px solid rgba(255,255,255,.22);flex:0 0 auto}
#cat-blacklist .blw-rot i{position:absolute;top:0;bottom:0;width:50%;display:block}
#cat-blacklist .blw-rot i:nth-child(1){left:0;background:#2b6bff;
  animation:blwAzul 1.1s steps(1,end) infinite}
#cat-blacklist .blw-rot i:nth-child(2){right:0;background:#ff2b2b;
  animation:blwVerm 1.1s steps(1,end) infinite}
@keyframes blwAzul{0%,49%{opacity:1;box-shadow:0 0 14px 5px rgba(43,107,255,.95)}50%,100%{opacity:.14;box-shadow:none}}
@keyframes blwVerm{0%,49%{opacity:.14;box-shadow:none}50%,100%{opacity:1;box-shadow:0 0 14px 5px rgba(255,43,43,.95)}}
/* as estrelas */
#cat-blacklist .blw-stars{display:flex;gap:3px;line-height:1}
#cat-blacklist .blw-s{
  font-size:clamp(13px,1.35vw,19px);color:#3a3f49;
  animation:blwAcende 2.6s ease-in-out infinite;
  animation-delay:calc(var(--i) * .22s)}
@keyframes blwAcende{
  0%,8%   {color:#3a3f49;text-shadow:none}
  18%,62% {color:#fff;text-shadow:0 0 7px rgba(255,255,255,.95),0 0 16px rgba(242,194,48,.9),0 0 30px rgba(255,43,43,.6)}
  80%,100%{color:#3a3f49;text-shadow:none}
}
@media(max-width:760px){
  #cat-blacklist .blw{right:10px;padding:6px 9px;gap:7px}
  #cat-blacklist .blw-rot{width:22px;height:9px}
  #cat-blacklist .blw-s{font-size:12px}
}
@media(prefers-reduced-motion:reduce){
  #cat-blacklist .blw-rot i,#cat-blacklist .blw-s{animation:none}
  #cat-blacklist .blw-s{color:#fff}
}

/* ===== O Braga (11/10/2026): o branco acima da faixa que roda ============
   Nesta pagina a faixa do titulo ficou em position:relative. Assim ela
   OCUPA espaco no fluxo (154px) e ainda por cima desloca-se com o 'top' -
   era isso que empurrava a faixa que roda 154px para baixo (todo aquele
   branco) e deixava o titulo de fora do carbono.
   Absoluta: deixa de ocupar espaco, a faixa que roda sobe e o titulo volta
   para dentro do carbono. */
#cat-blacklist .tit-video{position:absolute !important}
/* um dedo de ar entre o menu e a faixa que roda - nao colada, mas la em cima */
#cat-blacklist .bl-marquee{margin-top:12px !important}

/* ===== O Braga (11/10/2026): escolher km/h ou mph ao publicar ============
   O campo da velocidade passa a ter o selector da unidade ao lado, e por
   baixo aparece a conversao para o piloto ver o que vai sair no quadro. */
.bl-unitrow{display:flex;gap:8px;align-items:stretch}
.bl-unitrow input{flex:1 1 auto;min-width:0}
.bl-unitrow select{flex:0 0 auto;width:92px}
.bl-conv{margin-top:6px;font:500 12px Oswald,sans-serif;letter-spacing:.4px;
  color:var(--yellow,#F2C230);min-height:15px}

/* ===== O Braga (11/10/2026): as corridas do piloto no perfil dele ========
   Cada corrida com a prova, os numeros, o sitio e os botoes de corrigir e
   apagar. Mesma linguagem escura/dourada do resto. */
.mc-lista{display:flex;flex-direction:column;gap:10px}
.mc-linha{display:flex;align-items:center;gap:14px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:11px 13px}
.mc-linha:hover{border-color:rgba(242,194,48,.5)}
.mc-prova{width:74px;height:54px;flex:0 0 74px;border-radius:9px;object-fit:cover;
  background:#14161b;border:1px solid rgba(255,255,255,.14)}
.mc-sem{display:flex;align-items:center;justify-content:center;
  color:#7f8792;font:500 11px Oswald,sans-serif;letter-spacing:1px;text-transform:uppercase}
.mc-dados{flex:1 1 auto;min-width:0}
.mc-vel{font-family:'Racing Sans One',sans-serif;color:var(--yellow,#F2C230);
  font-size:19px;line-height:1.15}
.mc-sub{font-family:Oswald,sans-serif;font-size:12px;color:#9aa0aa;letter-spacing:.4px}
.mc-veh{font:600 13.5px Oswald,sans-serif;color:#fff;margin-top:2px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mc-mods{font:400 12.5px Oswald,sans-serif;color:#aeb6c1;margin-top:1px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mc-loc{font:400 12px Oswald,sans-serif;color:#8a9099;margin-top:2px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mc-bts{display:flex;flex-direction:column;gap:6px;flex:0 0 auto}
.mc-bt{padding:6px 14px !important;font-size:11.5px !important;white-space:nowrap}
.mc-del:hover{border-color:var(--red,#D21F1F) !important;color:#ff8a8a !important}
.mc-conta{display:inline-block;margin-left:8px;padding:1px 9px;border-radius:999px;
  background:rgba(242,194,48,.18);color:var(--yellow,#F2C230);
  font:600 12px Oswald,sans-serif}
.mc-nota{margin-top:10px;font:400 12px Oswald,sans-serif;color:#8a9099;line-height:1.5}
@media(max-width:620px){
  .mc-linha{flex-wrap:wrap}
  .mc-bts{flex-direction:row;width:100%}
  .mc-bt{flex:1 1 auto}
}
/* corrida que o piloto retirou: o administrador ainda a ve, marcada */
#rankadm-body tr.radm-fora{opacity:.55}
#rankadm-body tr.radm-fora td{text-decoration:line-through}
#rankadm-body .radm-tag{display:inline-block;margin-left:8px;padding:1px 8px;border-radius:999px;
  background:rgba(210,31,31,.18);border:1px solid rgba(210,31,31,.5);color:#ff8a8a;
  font:600 10px Oswald,sans-serif;letter-spacing:.8px;text-transform:uppercase;text-decoration:none}

/* ===== O Braga (11/10/2026): o catalogo a dizer que ainda esta a carregar =
   Enquanto faltam pedacos, a contagem da lugar a "Loading the full catalog"
   com uma barra, e a paginacao fica apagada - para ninguem ler um numero
   parcial como se fosse o total. */
/* enquanto carrega, o aviso e o nosso: o do filtro fica escondido para os
   dois nao disputarem o mesmo sitio */
.prod-block.blp-carregando .filter-count{display:none !important}
.blp-carga{display:none}
.prod-block.blp-carregando .blp-carga{
  display:block;margin:8px 0 0;padding:10px 14px;border-radius:10px;
  background:rgba(242,194,48,.12);border:1px solid rgba(242,194,48,.45);
  color:var(--yellow,#F2C230);font:500 13px Oswald,sans-serif;letter-spacing:.4px}
.prod-block.blp-carregando .blp-carga strong{color:var(--yellow,#F2C230);font-weight:700}
.blp-carga-n{margin-left:8px;color:#aeb6c1;font-weight:500}
.blp-barra{display:block;height:4px;margin-top:8px;border-radius:999px;
  background:rgba(255,255,255,.14);overflow:hidden}
.blp-barra i{display:block;height:100%;border-radius:999px;
  background:var(--yellow,#F2C230);transition:width .35s ease}
/* a paginacao parcial nao se deve ler como final */
.prod-block.blp-carregando [class*=pag]{opacity:.35;pointer-events:none}
body.teste-branco .prod-block.blp-carregando .blp-carga{
  background:#fff8e2;border-color:#e2b93a;color:#7a5c00}
body.teste-branco .prod-block.blp-carregando .blp-carga strong{color:#7a5c00}

/* ===== O Braga (11/10/2026): acerto de telemovel e tablet ================
   Medido num iPhone de 390px: a coluna de conteudo tinha so 310px (24px de
   recuo da seccao + 16px do corpo, de cada lado). Sobravam 80px de branco
   num ecra pequeno e os cartoes ficavam espremidos. Alem disso havia letra
   de 8,5px e botoes de 12 a 27px de altura - dificeis de ler e de acertar
   com o dedo. Minimo que uso: 11px de letra e 36px de alvo. */
@media(max-width:640px){
  #catalog, #cat-vehicles, #cat-blacklist{
    padding-left:14px !important;padding-right:14px !important}
  #catalog > .section-body, #cat-vehicles > .section-body, #cat-blacklist > .section-body{
    padding-left:8px !important;padding-right:8px !important}

  /* letra dos cartoes de produto: nada abaixo de 11px */
  .prod-card .pc-brand,.prod-card .pc-code,.prod-card .pc-pn,.prod-card .pc-stock,
  .prod-card .pc-name,.prod-card .pc-price{font-size:11px !important;line-height:1.35 !important}
  .prod-card .pc-price{font-size:12.5px !important}

  /* alvos de toque: 36px e o minimo para o dedo acertar */
  .prod-card .pc-add,.prod-card .pc-view{
    min-height:36px !important;font-size:11.5px !important;
    display:flex !important;align-items:center !important;justify-content:center !important}
  .prod-card .pc-plink{min-height:36px !important;display:flex !important;align-items:center !important}
  .vmk-chip{min-height:36px !important;display:inline-flex !important;align-items:center !important;
    font-size:12px !important}
  #cat-blacklist .bl-soc{min-height:34px !important;padding:7px 12px !important;font-size:12px !important}
  .vmx-m{min-height:42px !important}
  .vmx-chip{min-height:36px !important}
  /* as ultimas letras pequenas que sobraram na auditoria */
  .veh-mq-tag{font-size:11px !important}
  .noimg,.pc-noimg,.pc-fotonota{font-size:11px !important}
}

/* tablet: o conteudo pode respirar mais, mas a letra tambem nao desce dos 11 */
@media(min-width:641px) and (max-width:1024px){
  .prod-card .pc-brand,.prod-card .pc-code,.prod-card .pc-pn,.prod-card .pc-stock{font-size:11.5px !important}
  .vmk-chip{min-height:36px !important;display:inline-flex !important;align-items:center !important}
  #cat-blacklist .bl-soc{min-height:34px !important;padding:7px 12px !important}
  .noimg,.pc-noimg,.pc-fotonota{font-size:11px !important}
}
/* marca sem lista de modelos no quadro "Shop by model" */
.vmx-semmod{color:#aeb6c1;font:400 14px/1.7 Oswald,sans-serif;letter-spacing:.3px}
.vmx-semmod .vmx-chip{margin-top:10px}

/* ===== O Braga (11/10/2026): a pagina do Dinamometro igual a "Find Your Part"
   1. a capa em video da BLACKLIST no topo, de ponta a ponta e dentro do fluxo
      (a faixa que la estava era absoluta e ficava escondida por tras do corpo
      branco: nunca se via banner nenhum nesta pagina);
   2. a faixa de fibra de carbono com os dois riscos dourados atras do titulo,
      tratada pelo BLPFaixaVideo como nas outras paginas;
   3. os textos desta pagina foram escolhidos para fundo escuro - sobre o
      branco o titulo de cada bloco era branco sobre branco e o paragrafo era
      cinzento claro. Mesmo remedio das paginas de marca: quadro escuro.
   ------------------------------------------------------------------------ */
#cat-dyno.tem-capa-video .section-body{padding-top:0 !important}
#cat-dyno #dyno-capa{
  position:relative !important;
  aspect-ratio:1920/400 !important;height:auto !important;
  margin:0 0 0 0;overflow:hidden;line-height:0;
  width:100vw !important;max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important;margin-right:calc(50% - 50vw) !important}
#cat-dyno #dyno-capa .capa-vid{position:absolute;inset:0;
  width:100%;height:100%;object-fit:cover;display:block}
#cat-dyno #dyno-capa::after{display:none}

/* --- textos que estavam apagados --------------------------------------- */
body.teste-branco #cat-dyno .dyno-split .dsx{
  background:#262b36 !important;
  border:1px solid rgba(255,255,255,.14) !important;
  border-radius:14px !important;
  padding:20px 24px !important;
  box-shadow:0 14px 40px -26px rgba(0,0,0,.6)}
body.teste-branco #cat-dyno .dyno-split .dsx h3{color:#ffffff !important}
body.teste-branco #cat-dyno .dyno-split .dsx p{color:#e4e9f0 !important}
body.teste-branco #cat-dyno .dyno-split .dsx strong,
body.teste-branco #cat-dyno .dyno-split .dsx b{color:#ffffff !important}

/* o aviso vermelho do topo: #ff8a7a nao se le em branco */
body.teste-branco #cat-dyno .dyno-warn{
  background:rgba(210,31,31,.07) !important;
  border-color:rgba(210,31,31,.5) !important;
  color:#9b1616 !important}

/* o aviso dourado de quem vem do Guia */
body.teste-branco #cat-dyno .dyno-toguide{
  background:rgba(242,194,48,.16) !important;
  border-color:rgba(242,194,48,.55) !important;
  color:#4a3c06 !important}

/* O sobretitulo e o titulo NAO levam cor de pagina branca: com a faixa de
   carbono por tras eles ficam sobre fundo escuro, e as regras de
   .tem-faixa-video ja lhes dao o branco certo. Pintei-os de preto numa
   primeira tentativa e o "DYNAMOMETER" desapareceu dentro do carbono. */

@media(max-width:640px){
  body.teste-branco #cat-dyno .dyno-split .dsx{padding:14px 16px !important}
}

/* ===== O Braga (11/10/2026): o Dinamometro explicado ======================
   1. No computador o texto ao lado da foto era pequeno de mais para a altura
      da imagem - tres linhas finas ao lado de um quadro de 300px. Cresce.
   2. Tres blocos de duas linhas cada passam a dois blocos com conteudo a
      serio, e o resto do que ele queria dizer vai para um manual: o que a
      pagina faz, por que ordem, e o que sai dela (carrinho e PDF).
   ------------------------------------------------------------------------ */
@media(min-width:861px){
  #cat-dyno .dyno-split .dsx h3{font-size:30px !important;line-height:1.14 !important;margin:0 0 12px !important}
  #cat-dyno .dyno-split .dsx p{font-size:17px !important;line-height:1.68 !important}
  body.teste-branco #cat-dyno .dyno-split .dsx{padding:26px 30px !important}
}

/* --- o manual ----------------------------------------------------------- */
#cat-dyno .dyno-manual{
  max-width:1150px;margin:34px auto 0;
  background:#262b36;border:1px solid rgba(255,255,255,.14);
  border-radius:16px;padding:28px 32px;
  box-shadow:0 14px 40px -26px rgba(0,0,0,.6)}
#cat-dyno .dyno-manual-t{
  font-family:'Racing Sans One',sans-serif;color:#F2C230;
  font-size:26px;margin:0 0 18px;letter-spacing:.3px}
#cat-dyno .dyno-steps{margin:0;padding:0;list-style:none;counter-reset:dstep}
#cat-dyno .dyno-steps li{
  counter-increment:dstep;position:relative;
  padding:0 0 0 52px;margin:0 0 18px;
  color:#e4e9f0;font-size:16px;line-height:1.66}
#cat-dyno .dyno-steps li:last-child{margin-bottom:0}
#cat-dyno .dyno-steps li::before{
  content:counter(dstep);position:absolute;left:0;top:1px;
  width:34px;height:34px;border-radius:50%;
  background:rgba(242,194,48,.12);border:1px solid rgba(242,194,48,.5);
  color:#F2C230;font:700 16px 'Oswald',sans-serif;
  display:flex;align-items:center;justify-content:center}
#cat-dyno .dyno-steps li b{color:#ffffff;font-family:'Oswald',sans-serif;font-weight:600}
#cat-dyno .dyno-steps li strong{color:#ffffff}
#cat-dyno .dyno-manual-note{
  margin-top:22px;padding-top:18px;
  border-top:1px solid rgba(255,255,255,.12);
  color:#c3c9d3;font-size:14.5px;line-height:1.65}
#cat-dyno .dyno-manual-note b{color:#F2C230;font-family:'Oswald',sans-serif;font-weight:600}
#cat-dyno .dyno-split .dsx strong{color:#ffffff}

@media(max-width:860px){
  #cat-dyno .dyno-manual{padding:20px 18px;margin-top:24px;border-radius:14px}
  #cat-dyno .dyno-manual-t{font-size:21px;margin-bottom:14px}
  #cat-dyno .dyno-steps li{padding-left:42px;font-size:14.5px;margin-bottom:15px}
  #cat-dyno .dyno-steps li::before{width:28px;height:28px;font-size:14px}
  #cat-dyno .dyno-manual-note{font-size:13.5px}
}

/* ===== O Braga (11/10/2026): a entrada do Dinamometro ====================
   Estava feia e por boas razoes: primeiro vinha um aviso cor-de-rosa da
   largura toda, com letra minuscula, e so depois e que se dizia ao cliente
   o que a pagina era. Aviso antes da explicacao, texto solto no branco,
   alinhado a esquerda por baixo de um titulo centrado, com entrelinha de
   1,75 que o esticava ainda mais.
   Agora: primeiro a frase de abertura, centrada e grande, a condizer com o
   titulo; o aviso passa a ser uma nota discreta por baixo, do tamanho do
   texto que tem, com o risco vermelho da marca do lado esquerdo.
   ------------------------------------------------------------------------ */
#cat-dyno .dyno-lead{max-width:880px;margin:24px auto 0;text-align:center;padding:0 18px}
#cat-dyno .dyno-lead-p{
  margin:0;font-size:18.5px;line-height:1.62;
  color:#1d222a;letter-spacing:.1px}
body.teste-branco #cat-dyno .dyno-lead-p{color:#1d222a !important}
#cat-dyno .dyno-lead-p strong{color:#0e1116;font-weight:600}
body.teste-branco #cat-dyno .dyno-lead-p strong{color:#0e1116 !important}

#cat-dyno .dyno-lead .dyno-warn,
body.teste-branco #cat-dyno .dyno-lead .dyno-warn{
  display:inline-flex !important;align-items:flex-start;gap:8px;
  width:auto !important;max-width:660px !important;
  margin:22px auto 0 !important;
  background:#faf4f4 !important;
  border:1px solid rgba(210,31,31,.26) !important;
  border-left:3px solid #D21F1F !important;
  border-radius:9px !important;
  padding:10px 16px !important;
  font-size:12.5px !important;line-height:1.5 !important;
  color:#7a1a1a !important;text-align:left !important;letter-spacing:.1px;
  text-wrap:balance}

@media(max-width:640px){
  #cat-dyno .dyno-lead{padding:0 16px;margin-top:18px}
  #cat-dyno .dyno-lead-p{font-size:15.5px;line-height:1.6}
  #cat-dyno .dyno-lead .dyno-warn,
  body.teste-branco #cat-dyno .dyno-lead .dyno-warn{
    font-size:11.5px !important;padding:9px 13px !important;margin-top:16px !important}
}

/* ===== O Braga (11/10/2026): o aviso de estimativa salta no ecra =========
   Mesmo desenho do aviso de 18+ da Blacklist, em dourado em vez de vermelho:
   e um aviso de rigor, nao de perigo. O aviso escrito na pagina desaparece -
   dizer a mesma coisa duas vezes e a melhor forma de nao ser lido nenhuma. */
.dyno-est-ov .dyno-est-modal{
  border-color:rgba(242,194,48,.45) !important;
  box-shadow:0 30px 90px -20px rgba(242,194,48,.28),
             0 0 0 1px rgba(255,255,255,.04) !important}
.dyno-est-ov .dyno-est-badge{
  background:linear-gradient(135deg,#F2C230,#ffd964) !important;
  color:#15140c !important;font-size:17px !important;letter-spacing:.5px;
  box-shadow:0 10px 26px -8px rgba(242,194,48,.65) !important}
.dyno-est-ov .dyno-est-btn{
  background:linear-gradient(135deg,#F2C230,#ffd45e) !important;
  color:#15140c !important;
  box-shadow:0 10px 26px -10px rgba(242,194,48,.7) !important}
.dyno-est-ov .age-points span{line-height:1.45}
@media(max-width:640px){
  .dyno-est-ov .dyno-est-btn{font-size:12.5px !important;letter-spacing:.2px}
}

/* ===== O Braga (11/10/2026): a abertura do Dinamometro, maior e mais limpa =
   O aviso de estimativa saiu daqui - salta no ecra quando a pagina abre.
   O que fica e so a frase de abertura: risco dourado curto por cima, letra
   grande e leve, centrada, com a medida certa para nao passar das 70 letras
   por linha. Sem caixa nenhuma: por baixo de um banner de carbono e de um
   titulo deste tamanho, mais uma moldura so abafava o texto.
   ------------------------------------------------------------------------ */
#cat-dyno .dyno-lead{max-width:900px !important;margin:30px auto 0 !important}
#cat-dyno .dyno-lead-rule{
  width:56px;height:3px;border-radius:2px;
  background:var(--yellow,#F2C230);margin:0 auto 22px}
#cat-dyno .dyno-lead-p{
  font-size:21px !important;line-height:1.56 !important;
  font-weight:300 !important;letter-spacing:.1px;text-wrap:balance}
#cat-dyno .dyno-lead-p strong{font-weight:600 !important}

/* A frase grande por cima: o tamanho dela NAO se escolhe aqui. Ha um modulo
   que a estica ate encostar as duas pontas da caixa, por medicao, e poe o
   resultado em style com !important - qualquer font-size posto no CSS era
   ignorado. O que a faz crescer e dar-lhe mais largura: a 860px ela cabia a
   19,9px; a 1150px, a mesma largura dos blocos com foto por baixo, fica perto
   dos 25px e alinha com eles. */
#cat-dyno .section-body>h2+.sec-count{
  max-width:1150px !important;line-height:1.26 !important;letter-spacing:.2px}

@media(max-width:860px){
  #cat-dyno .dyno-lead{margin-top:22px !important}
  #cat-dyno .dyno-lead-p{font-size:18px !important;line-height:1.58 !important}
  #cat-dyno .dyno-lead-rule{width:46px;margin-bottom:18px}
}
@media(max-width:640px){
  #cat-dyno .dyno-lead-p{font-size:16px !important;line-height:1.6 !important}
  #cat-dyno .dyno-lead-rule{width:40px;height:2.5px;margin-bottom:15px}
}

/* ===== O Braga (11/10/2026): o About como as outras paginas ==============
   O video da BLACKLIST sobe para capa, de ponta a ponta, e a faixa de fibra
   de carbono com os riscos dourados fica colada por baixo, com o titulo.
   O video que estava dentro do corpo sai: e o mesmo, nao faz sentido duas
   vezes. A faixa preta do graffiti tambem sai daqui - vai para o rodape. */
#about.tem-capa-video .section-body{padding-top:0 !important}
#about #about-capa{
  position:relative !important;
  aspect-ratio:1920/400 !important;height:auto !important;
  margin:0;overflow:hidden;line-height:0;
  width:100vw !important;max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important;margin-right:calc(50% - 50vw) !important}
#about #about-capa .capa-vid{position:absolute;inset:0;
  width:100%;height:100%;object-fit:cover;display:block}
#about #about-capa::after{display:none}
#about.tem-capa-video > .tag-band{display:none !important}
#about.tem-capa-video .story-banner{display:none !important}

/* ===== A frase do graffiti no rodape, em todas as paginas ================
   Fina de proposito: a altura e dada pelo texto, nao pela imagem. O texto
   ocupa 83% da altura do ficheiro, por isso a imagem e dimensionada por
   altura/0,83 e o excesso transparente fica escondido pela faixa. Assim a
   frase enche a faixa de cima a baixo com uma margem pequena, em vez de
   nadar em 200px de preto como no topo do About. */
.blp-rodape-frase{
  --fraseH: clamp(34px, 4.4vw, 66px);
  width:100vw;max-width:100vw;
  margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
  margin-top:46px;margin-bottom:0;
  height:calc(var(--fraseH) + 22px);
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
  background:#0a0a0a;
  /* O Braga (11/10/2026): com os riscos dourados, como as faixas do titulo */
  border-top:4px solid var(--yellow,#F2C230);
  border-bottom:4px solid var(--yellow,#F2C230)}
.blp-rodape-frase img{
  height:calc(var(--fraseH) / .83);
  width:auto;max-width:none;display:block;
  filter:drop-shadow(0 0 14px rgba(255,255,255,.16))}
@media(max-width:640px){
  .blp-rodape-frase{
    --fraseH: clamp(26px, 7.4vw, 40px);
    height:calc(var(--fraseH) + 16px);
    margin-top:32px}
}

/* ===== O Braga (11/10/2026): a barra dos pagamentos encolhe ao conteudo ==
   Ele desenhou dois riscos no sitio onde a barra devia acabar: a caixa
   cinzenta ia de 1100px e os cartoes ocupavam 500, deixando dois rectangulos
   vazios, um de cada lado. Agora a barra tem a largura do que tem dentro,
   centrada, com cantos arredondados - mais discreta na pagina.
   Vale em todas as paginas onde a barra aparece. */
section.brand-page > .blp-paybar.flutua,
section.section > .blp-paybar.flutua,
.blp-paybar.flutua{
  width:fit-content !important;
  max-width:calc(100% - 32px) !important;
  margin-left:auto !important;margin-right:auto !important;
  padding:14px 30px 16px !important;
  border-radius:14px !important;
  border-top:1px solid rgba(201,165,59,.22) !important}
@media(max-width:620px){
  section.brand-page > .blp-paybar.flutua,
  section.section > .blp-paybar.flutua,
  .blp-paybar.flutua{padding:12px 16px 14px !important;border-radius:12px !important}
}

/* ===== O Braga (11/10/2026): os Projects com o padrao das outras paginas ==
   O banner ia de 1280px, com margens dos lados, e o titulo assentava num
   cinzento claro (#f4f6f9) que nao existe em mais nenhuma pagina do site.
   Agora: banner de ponta a ponta, faixa de fibra de carbono com os riscos
   dourados colada por baixo com o titulo la dentro, e o resto - a frase, o
   botao e a nota - a seguir, na pagina, antes do quadro da pesquisa.
   ------------------------------------------------------------------------ */
#projects .prj-hero.capa{
  width:100vw !important;max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important;margin-right:calc(50% - 50vw) !important}

/* o bloco do titulo deixa de ser uma caixa cinzenta */
#projects .prj-call{
  background:transparent !important;
  border-top:0 !important;border-bottom:0 !important;
  padding-top:0 !important}
/* ATENCAO a quem mexer aqui: tudo o que muda MEDIDAS tem de ficar fora do
   selector .tem-faixa-video. A altura da faixa e medida a partir do titulo,
   e a classe so entra quando duas medicoes seguidas dao o mesmo valor. Se
   a classe mudar margens ou padding, a medicao muda, a classe sai, as
   margens voltam, a medicao muda outra vez - e a faixa fica a piscar para
   sempre, sem riscos dourados. Debaixo desta classe so entram cores. */
#projects .prj-call-in{position:relative;padding-top:24px}
#projects .prj-call-eye,
#projects h2.prj-call-t{position:relative;z-index:1;background:transparent !important}
#projects h2.prj-call-t{margin:8px 0 0 !important;padding-bottom:20px}
#projects p.prj-call-d{margin-top:28px}
/* so cores a partir daqui */
#projects.tem-faixa-video .prj-call-eye{
  color:var(--yellow,#F2C230) !important;text-shadow:0 2px 12px rgba(0,0,0,.8)}
#projects.tem-faixa-video h2.prj-call-t{
  color:#fff !important;text-shadow:0 2px 18px rgba(0,0,0,.75)}

/* ===== O Braga (12/10/2026): o texto dos Projects na mesma escala das ====
   outras paginas. Estava a 17px com entrelinha de 1,7 - miudo e solto por
   baixo de um titulo de 46px. Passa a mesma medida que o Dinamometro:
   21px, leve, centrado, com a largura certa para nao passar das 70 letras
   por linha. A nota por baixo fica discreta, como nota que e.
   (Estas regras ficam FORA de .tem-faixa-video de proposito - ver o aviso
   mais acima sobre a faixa a piscar.) */
#projects p.prj-call-d{
  font-size:21px !important;line-height:1.56 !important;
  font-weight:300 !important;letter-spacing:.1px;
  color:#1d222a !important;max-width:860px !important;text-wrap:balance}
#projects p.prj-call-d strong,
#projects p.prj-call-d b{font-weight:600 !important;color:#0e1116 !important}
/* A nota deixa de ser uma frase cinzenta solta e passa a uma etiqueta, que
   e o que o site usa para linhas de apoio: maiusculas, espacadas, no
   dourado que se le em fundo branco. Mesma familia (Oswald) que o resto -
   o que muda e o tratamento. */
#projects .prj-call-note{
  font-size:11.5px !important;line-height:1.7;
  letter-spacing:1.5px;text-transform:uppercase;
  font-weight:500 !important;color:#8a6a08 !important;
  max-width:680px;margin-left:auto;margin-right:auto}
@media(max-width:860px){
  #projects p.prj-call-d{font-size:18px !important;line-height:1.58 !important}
}
@media(max-width:640px){
  #projects p.prj-call-d{font-size:16px !important;line-height:1.6 !important}
  #projects .prj-call-note{font-size:10px !important;letter-spacing:1.1px}
}

/* ===== O convite dos Projects (bloco 72) ================================
   Mesmo desenho dos outros dois avisos que saltam no ecra, com a estrela
   dourada dos projectos e o botao no vermelho da marca - este nao e um
   aviso, e um convite a agir, e o vermelho e a cor de accao do site. */
.prj-convite-ov .prj-convite-modal{
  border-color:rgba(242,194,48,.42) !important;
  box-shadow:0 30px 90px -20px rgba(242,194,48,.26),
             0 0 0 1px rgba(255,255,255,.04) !important}
.prj-convite-ov .prj-convite-badge{
  background:linear-gradient(135deg,#F2C230,#ffd964) !important;
  color:#15140c !important;font-size:30px !important;line-height:1;
  box-shadow:0 10px 26px -8px rgba(242,194,48,.65) !important}
.prj-convite-ov .age-points span{line-height:1.45}
@media(max-width:640px){
  .prj-convite-ov .prj-convite-btn{font-size:12.5px !important;letter-spacing:.2px}
}

/* ===== O Braga (12/10/2026): o quadro do carro e o texto dos Projects ====
   1. Cada projecto era uma fila de 1100x176 com a foto num canto de 190px e
      815px de preto vazio ao lado. Com um carro na lista, aquilo era quase
      so caixa. Passa a mural: a foto no topo, em 4:3, e o texto por baixo.
      Quatro por fila no computador, duas no telemovel.
   2. A frase de abertura estava com 860px de largura e letra leve - duas
      linhas compridas e finas por baixo de um titulo enorme. Encurta-se a
      medida e engrossa-se um ponto: le-se como texto de marca, nao como
      texto de sistema.
   ------------------------------------------------------------------------ */
#projects .prj-grid{
  display:grid !important;
  grid-template-columns:repeat(auto-fill,minmax(248px,1fr)) !important;
  gap:18px !important;align-items:stretch}
#projects .prj-card{
  display:flex !important;flex-direction:column !important;
  width:auto !important;height:auto !important;min-height:0 !important;
  overflow:hidden;border-radius:14px}
#projects .prj-card .prj-img{
  width:100% !important;height:auto !important;flex:none !important;
  aspect-ratio:4/3;position:relative;overflow:hidden}
#projects .prj-card .prj-img img{
  width:100% !important;height:100% !important;object-fit:cover;display:block}
#projects .prj-card .prj-info{
  width:auto !important;flex:1 1 auto !important;
  padding:13px 14px 4px !important;min-width:0}
#projects .prj-card .prj-info h3{
  font-size:16px !important;line-height:1.25 !important;margin:4px 0 3px !important}
#projects .prj-card .prj-eyebrow{font-size:10.5px !important;letter-spacing:1.4px}
#projects .prj-card .prj-go{
  width:auto !important;height:auto !important;flex:none !important;
  padding:10px 14px 13px !important;justify-content:flex-start !important;
  border-left:0 !important;font-size:11px !important;letter-spacing:1.4px}

/* a frase de abertura: medida mais curta e um ponto mais encorpada */
#projects p.prj-call-d{
  font-size:19px !important;line-height:1.65 !important;
  font-weight:400 !important;letter-spacing:0 !important;
  color:#262c35 !important;max-width:680px !important}
@media(max-width:860px){
  #projects p.prj-call-d{font-size:17px !important}
  #projects .prj-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr)) !important;gap:14px !important}
}
@media(max-width:640px){
  #projects p.prj-call-d{font-size:15.5px !important}
  #projects .prj-grid{grid-template-columns:1fr 1fr !important;gap:12px !important}
  #projects .prj-card .prj-info h3{font-size:14px !important}
}

/* ===== O Braga (12/10/2026): a tira clara entre o cabecalho e o video ====
   A seccao dos Projects tinha 80px de espaco no topo, por isso o video
   comecava DEPOIS do cabecalho e via-se o fundo branco da seccao no meio.
   Nas outras paginas a seccao tem 10px e o video passa POR BAIXO do
   cabecalho, que e translucido - e por isso que la nao ha tira nenhuma.
   Fica igual. */
#projects{padding-top:10px !important}

/* ===== O desenho D1 escolhido pelo Braga (12/10/2026) ====================
   A frase, os botoes e a nota num cartao escuro so, em vez de tres coisas
   centradas e soltas no meio do branco. O botao principal fica dourado (num
   fundo escuro, o preto que tinha desaparecia) e o segundo, o que reabre o
   convite, fica de contorno. */
#projects .prj-cartao{
  max-width:780px;margin:clamp(22px,3vw,32px) auto 0;
  background:#262b36;border:1px solid rgba(255,255,255,.1);
  border-radius:16px;padding:clamp(22px,3vw,30px) clamp(18px,3vw,30px) clamp(20px,2.6vw,26px);
  text-align:center;
  box-shadow:0 18px 50px -32px rgba(0,0,0,.75)}

#projects .prj-cartao p.prj-call-d{
  color:#e4e9f0 !important;font-size:18px !important;
  line-height:1.62 !important;font-weight:300 !important;
  max-width:56ch !important;margin:0 auto !important}
#projects .prj-cartao p.prj-call-d strong,
#projects .prj-cartao p.prj-call-d b{color:#fff !important;font-weight:600 !important}

#projects .prj-cartao .prj-call-acts{
  display:flex;gap:12px;flex-wrap:wrap;justify-content:center;
  margin-top:20px !important}

/* botao principal: dourado, para nao desaparecer no cartao escuro */
#projects .prj-cartao .prj-add-btn{
  margin-top:0 !important;
  background:var(--yellow,#F2C230) !important;color:#15140c !important;
  border:2px solid var(--yellow,#F2C230) !important}
#projects .prj-cartao .prj-add-btn:hover{
  filter:brightness(1.07);box-shadow:0 10px 26px -12px rgba(242,194,48,.8)}

/* segundo botao: de contorno - a accao principal tem de ganhar a vista */
#projects .prj-cartao .prj-convite-btn2{
  background:transparent !important;color:#e4e9f0 !important;
  border:2px solid rgba(255,255,255,.3) !important;
  display:inline-flex;align-items:center}
#projects .prj-cartao .prj-convite-btn2:hover{
  border-color:var(--yellow,#F2C230) !important;color:#fff !important;
  background:rgba(242,194,48,.08) !important;box-shadow:none}
#projects .prj-cartao .prj-convite-btn2 .prj-est{
  color:var(--yellow,#F2C230);margin-right:8px;font-style:normal;font-size:14px;line-height:1}

/* a nota, dentro do cartao, no dourado que se le em fundo escuro */
#projects .prj-cartao .prj-call-note{
  color:var(--yellow,#F2C230) !important;
  margin-top:14px !important;max-width:560px}

@media(max-width:640px){
  #projects .prj-cartao{border-radius:14px}
  #projects .prj-cartao p.prj-call-d{font-size:15.5px !important}
  #projects .prj-cartao .prj-call-acts{gap:9px}
  #projects .prj-cartao .prj-add-btn{width:100%}
}

/* ===== O carrossel dos projectos (bloco 74) =============================
   A grelha passa a trilho horizontal com encaixe. As setas ficam por cima
   das pontas e so aparecem quando ha mesmo o que percorrer. O esbatido das
   bordas diz a quem olha que a lista continua para o lado. */
#projects .prj-carrossel{position:relative;max-width:1100px;margin:0 auto}

#projects .prj-carrossel .prj-grid{
  display:flex !important;grid-template-columns:none !important;
  /* a lista original era uma coluna (flex-direction:column): sem isto o
     flex-basis dos cartoes ia para a ALTURA e cada um ficava com a largura
     toda do trilho - 1096px em vez de 274px */
  flex-direction:row !important;flex-wrap:nowrap !important;
  align-items:stretch !important;
  gap:16px !important;
  overflow-x:auto;overflow-y:hidden;
  scroll-snap-type:x mandatory;scroll-behavior:smooth;
  padding:4px 2px 10px !important;margin:0 !important;
  scrollbar-width:none;-ms-overflow-style:none;
  cursor:grab}
#projects .prj-carrossel .prj-grid::-webkit-scrollbar{display:none}
#projects .prj-carrossel .prj-grid.a-arrastar{cursor:grabbing;scroll-behavior:auto;scroll-snap-type:none}
#projects .prj-carrossel.tem-setas .prj-grid{
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 34px,#000 calc(100% - 34px),transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 34px,#000 calc(100% - 34px),transparent 100%)}

#projects .prj-carrossel .prj-card{
  flex:0 0 clamp(228px,23vw,274px) !important;
  scroll-snap-align:start;
  transition:transform .18s ease, box-shadow .18s ease}
#projects .prj-carrossel .prj-card:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 38px -24px rgba(0,0,0,.75)}

#projects .prj-seta{
  position:absolute;top:calc(50% - 26px);z-index:3;
  width:44px;height:44px;border-radius:50%;
  display:none;align-items:center;justify-content:center;
  background:rgba(14,16,21,.92);color:#f0f2f5;
  border:1px solid rgba(255,255,255,.18);cursor:pointer;
  box-shadow:0 10px 26px -12px rgba(0,0,0,.8);
  transition:background .15s ease,border-color .15s ease,opacity .15s ease}
#projects .prj-carrossel.tem-setas .prj-seta{display:flex}
#projects .prj-seta svg{width:20px;height:20px}
#projects .prj-seta.esq{left:-10px}
#projects .prj-seta.dir{right:-10px}
#projects .prj-seta:hover{background:#15181f;border-color:var(--yellow,#F2C230);color:var(--yellow,#F2C230)}
#projects .prj-seta:disabled{opacity:.28;cursor:default;pointer-events:none}

@media(max-width:640px){
  #projects .prj-carrossel .prj-card{flex:0 0 74vw !important}
  #projects .prj-seta{display:none !important}
  #projects .prj-carrossel.tem-setas .prj-seta{display:none !important}
}

/* ===== Lugares livres no carrossel (bloco 75) ===========================
   Nao e um carro, e um lugar a espera de um: sem foto, sem link, tracejado
   em vez de cheio, para ninguem confundir com um build a serio. */
/* fundo escuro como os cartoes a serio: com fundo transparente o cartao
   assentava no branco da pagina e o texto claro desaparecia */
#projects .prj-card.prj-vazio{
  cursor:default;background:#171a20 !important;
  border:1.5px dashed rgba(242,194,48,.3) !important;
  box-shadow:none !important}
#projects .prj-carrossel .prj-card.prj-vazio:hover{transform:none;box-shadow:none}
#projects .prj-vazio .prj-vazio-img{
  background:
    repeating-linear-gradient(135deg,rgba(255,255,255,.028) 0 9px,transparent 9px 18px),
    #15181f !important;
  display:flex;align-items:center;justify-content:center}
#projects .prj-vazio .prj-vazio-mais{
  font-family:'Oswald',sans-serif;font-weight:300;font-size:40px;line-height:1;
  color:rgba(242,194,48,.45)}
#projects .prj-vazio .prj-info{background:transparent !important;padding-bottom:14px !important}
#projects .prj-vazio .prj-eyebrow{color:rgba(242,194,48,.72) !important}
#projects .prj-vazio h3{color:rgba(255,255,255,.62) !important;font-style:normal !important}
#projects .prj-vazio .prj-by{color:rgba(255,255,255,.34) !important}

/* ===== lugar livre dos Projects como botao de accao =====
   Geometria fora de qualquer selector que ligue/desligue por classe:
   so cor, cursor e sombra mudam no hover. */
#projects .prj-card.prj-vazio.prj-vazio-on{cursor:pointer}
#projects .prj-carrossel .prj-card.prj-vazio.prj-vazio-on:hover{
  border-color:rgba(242,194,48,.85) !important;
  box-shadow:0 10px 30px -18px rgba(242,194,48,.55) !important;
}
#projects .prj-vazio.prj-vazio-on:hover .prj-vazio-img{
  background-color:rgba(242,194,48,.07);
}
#projects .prj-vazio.prj-vazio-on:hover .prj-vazio-mais{
  color:#F2C230;
  transform:scale(1.14);
}
#projects .prj-vazio .prj-vazio-mais{transition:transform .18s ease,color .18s ease}
#projects .prj-vazio-cta{
  color:rgba(242,194,48,.9) !important;
  font-weight:600;
  letter-spacing:.4px;
}
#projects .prj-vazio.prj-vazio-on:hover .prj-vazio-cta{color:#F2C230 !important}
#projects .prj-vazio.prj-vazio-on:hover h3{color:rgba(255,255,255,.88) !important}
#projects .prj-card.prj-vazio.prj-vazio-on:focus-visible{
  outline:2px solid #F2C230;
  outline-offset:3px;
}

/* ===== carrossel dos Projects: moldura dourada, setas fora do trilho =====
   O problema: a mascara de 34px comia a esquerda do primeiro cartao e a seta
   ficava POR CIMA da foto (left:-10px num elemento de 44px).
   Agora as setas tem corredor proprio e o trilho fica inteiro. */
#projects .prj-carrossel{
  box-sizing:border-box;
  padding:14px 58px 10px;
  /* moldura dourada a toda a volta, nao so nos lados */
  border:4px solid var(--yellow,#F2C230);
  border-radius:14px;
  /* fundo escuro: o branco da pagina era o que aparecia atras do primeiro
     cartao e dava o efeito de a foto estar cortada */
  background:#0e1016;
}
/* nada de mascara: era isto que corroia a imagem do carro */
#projects .prj-carrossel.tem-setas .prj-grid{
  -webkit-mask-image:none !important;
  mask-image:none !important;
}
#projects .prj-seta.esq{left:7px}
#projects .prj-seta.dir{right:7px}

@media(max-width:640px){
  #projects .prj-carrossel{
    padding:12px;
    border-width:3px;
  }
}

/* ===== alternar entre carrossel e lista completa ===== */
#projects .prj-vista-barra{
  max-width:1100px;
  margin:0 auto 12px;
  display:flex;
  justify-content:flex-end;
  gap:8px;
}
#projects .prj-vista-barra button{
  display:inline-flex;align-items:center;gap:7px;
  font-family:'Oswald',sans-serif;font-size:12px;font-weight:600;
  letter-spacing:1px;text-transform:uppercase;
  padding:9px 15px;border-radius:9px;cursor:pointer;
  background:#171a20;color:#aab1bd;
  border:1px solid rgba(255,255,255,.14);
  transition:color .15s ease,border-color .15s ease,background .15s ease;
}
#projects .prj-vista-barra button svg{width:15px;height:15px}
#projects .prj-vista-barra button:hover{color:#e8ebf0;border-color:rgba(242,194,48,.5)}
#projects .prj-vista-barra button.on{
  background:#0e1016;color:var(--yellow,#F2C230);
  border-color:var(--yellow,#F2C230);
}

/* ===== modo LISTA: linhas, nao cartoes lado a lado =====
   Sem moldura e sem caixa escura - volta ao aspecto de antes. Cada projecto
   passa a ser uma linha: foto a esquerda e a informacao por ordem a seguir. */
#projects .prj-carrossel.modo-lista{
  border:0 !important;
  background:transparent !important;
  border-radius:0 !important;
  padding:0 !important;
  max-width:1100px;
}
#projects .prj-carrossel.modo-lista .prj-seta{display:none !important}

#projects .prj-carrossel.modo-lista .prj-grid{
  flex-direction:column !important;
  flex-wrap:nowrap !important;
  overflow:visible !important;
  scroll-snap-type:none !important;
  cursor:default !important;
  gap:12px !important;
  -webkit-mask-image:none !important;
  mask-image:none !important;
}

#projects .prj-carrossel.modo-lista .prj-card{
  flex:0 0 auto !important;
  width:100% !important;
  display:flex !important;
  flex-direction:row !important;
  align-items:stretch !important;
  transform:none !important;
}
#projects .prj-carrossel.modo-lista .prj-card:hover{
  transform:none !important;
  border-color:rgba(242,194,48,.55) !important;
}

#projects .prj-carrossel.modo-lista .prj-img{
  flex:0 0 190px !important;
  width:190px !important;
  height:118px !important;
  min-height:118px !important;
}
#projects .prj-carrossel.modo-lista .prj-img img{
  width:100% !important;height:100% !important;object-fit:cover !important;
}

#projects .prj-carrossel.modo-lista .prj-info{
  flex:1 1 auto !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  gap:4px;
  padding:12px 18px !important;
  min-width:0;
}
#projects .prj-carrossel.modo-lista .prj-info h3{margin:0 !important}
#projects .prj-carrossel.modo-lista .prj-meta-row{
  display:flex !important;align-items:center;gap:12px;flex-wrap:wrap;
}

/* o "Ver" encosta a direita, a meio da linha */
#projects .prj-carrossel.modo-lista .prj-go{
  position:static !important;
  align-self:center !important;
  flex:0 0 auto !important;
  margin-left:auto !important;
  padding:0 20px !important;
  white-space:nowrap;
}

/* lugares livres tambem viram linha */
#projects .prj-carrossel.modo-lista .prj-vazio .prj-vazio-img{
  height:118px !important;min-height:118px !important;
}

@media(max-width:620px){
  #projects .prj-carrossel.modo-lista .prj-img{
    flex:0 0 120px !important;width:120px !important;height:96px !important;min-height:96px !important;
  }
  #projects .prj-carrossel.modo-lista .prj-info{padding:10px 12px !important}
  #projects .prj-carrossel.modo-lista .prj-go{display:none !important}
}

/* ==========================================================================
   DESENHO E2 - a parede dos Projects (escolhido pelo Braga a 13/10/2026)
   Um projecto em destaque a toda a largura, os restantes numa tira fina.
   Seccao escura de ponta a ponta: era o fundo branco que fazia os cartoes
   parecerem buracos abertos numa folha.
   ========================================================================== */

/* ---- 1. a seccao deixa de ser branca ---- */
#projects{
  background:#0b0d11 !important;
  padding-bottom:46px !important;
}
#projects .prj-call-in{padding-top:30px}

/* o cartao de apresentacao perde a caixa: sobre escuro era caixa dentro
   de caixa, que era uma das coisas que o incomodavam */
#projects .prj-cartao{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  padding:4px 20px 0 !important;
}
#projects p.prj-call-d{color:#c8cfd9 !important}
#projects p.prj-call-d strong,
#projects p.prj-call-d b{color:#ffffff !important}
#projects .prj-call-note,
#projects .prj-call-eye{color:var(--yellow,#F2C230) !important}

/* ---- 2. sem moldura dourada: o E2 nao tem quadro ---- */
#projects .prj-carrossel.modo-destaque{
  border:0 !important;
  background:transparent !important;
  border-radius:0 !important;
  padding:0 20px !important;
  max-width:1180px;
}
#projects .prj-carrossel.modo-destaque .prj-seta{display:none !important}

/* ---- 3. grelha: o destaque ocupa a linha toda, a tira fica por baixo ---- */
#projects .prj-carrossel.modo-destaque .prj-grid{
  display:grid !important;
  grid-template-columns:repeat(4,1fr) !important;
  gap:14px !important;
  overflow:visible !important;
  scroll-snap-type:none !important;
  cursor:default !important;
  padding:0 !important;
  -webkit-mask-image:none !important;mask-image:none !important;
}
#projects .prj-carrossel.modo-destaque .prj-card{
  flex:none !important;width:auto !important;transform:none !important;
}

/* ---- 4. o destaque ---- */
#projects .modo-destaque .prj-card.prj-destaque{
  grid-column:1 / -1;
  position:relative;
  aspect-ratio:21/8;
  min-height:260px;
  border-radius:16px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.09) !important;
  margin-bottom:6px;
}
#projects .modo-destaque .prj-destaque .prj-img{
  position:absolute !important;inset:0 !important;
  width:100% !important;height:100% !important;border-radius:0 !important;
}
#projects .modo-destaque .prj-destaque .prj-img img{
  width:100% !important;height:100% !important;object-fit:cover !important;
}
/* o veu: escuro a esquerda para o texto se ler, limpo a direita */
#projects .modo-destaque .prj-destaque .prj-img-ov{
  position:absolute !important;inset:0 !important;
  background:linear-gradient(90deg,rgba(8,9,12,.95) 0%,rgba(8,9,12,.72) 38%,rgba(8,9,12,.08) 74%) !important;
  opacity:1 !important;
}
#projects .modo-destaque .prj-destaque .prj-info{
  position:absolute !important;
  left:clamp(20px,3.4vw,40px);
  top:50%;transform:translateY(-50%);
  max-width:48%;
  background:none !important;
  padding:0 !important;
  z-index:2;
}
#projects .modo-destaque .prj-destaque .prj-eyebrow{
  font-size:11px !important;letter-spacing:2.4px !important;
}
#projects .modo-destaque .prj-destaque h3{
  font-size:clamp(22px,2.9vw,34px) !important;
  line-height:1.1 !important;margin:8px 0 12px !important;color:#fff !important;
}
#projects .modo-destaque .prj-destaque .prj-meta-row{
  display:flex !important;align-items:center;gap:12px;flex-wrap:wrap;
}
#projects .modo-destaque .prj-destaque .prj-go{
  position:absolute !important;
  left:clamp(20px,3.4vw,40px);
  bottom:clamp(18px,3vw,30px);
  z-index:2;
  color:var(--yellow,#F2C230) !important;
  border-bottom:2px solid var(--yellow,#F2C230);
  padding:0 0 3px !important;
  font-size:11.5px !important;letter-spacing:1.3px;text-transform:uppercase;font-weight:600;
}
#projects .modo-destaque .prj-destaque .prj-badge{z-index:3}

/* ---- 5. a tira: os restantes e os lugares livres ---- */
#projects .modo-destaque .prj-card:not(.prj-destaque){
  border-radius:10px;
  overflow:hidden;
  min-height:0;
}
#projects .modo-destaque .prj-card:not(.prj-destaque) .prj-img{
  aspect-ratio:16/10 !important;height:auto !important;min-height:0 !important;
}
#projects .modo-destaque .prj-card:not(.prj-destaque) .prj-info{
  padding:9px 11px 11px !important;
}
#projects .modo-destaque .prj-card:not(.prj-destaque) .prj-eyebrow{
  font-size:9.5px !important;letter-spacing:1.4px !important;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
#projects .modo-destaque .prj-card:not(.prj-destaque) h3{
  font-size:13px !important;margin:3px 0 4px !important;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
#projects .modo-destaque .prj-card:not(.prj-destaque) .prj-hp-chip{font-size:10px !important}
#projects .modo-destaque .prj-card:not(.prj-destaque) .prj-by{font-size:11px !important}
#projects .modo-destaque .prj-card:not(.prj-destaque) .prj-go{display:none !important}

/* lugares livres na tira */
#projects .modo-destaque .prj-card.prj-vazio .prj-vazio-img{
  aspect-ratio:16/10 !important;height:auto !important;min-height:0 !important;
}
#projects .modo-destaque .prj-card.prj-vazio .prj-eyebrow{display:none !important}
#projects .modo-destaque .prj-card.prj-vazio h3{font-size:12px !important}

/* ---- 6. a barra de vistas sobre o escuro ---- */
#projects .prj-vista-barra{max-width:1180px;padding:0 20px;margin-bottom:14px}
#projects .prj-vista-barra button{background:#13171e;border-color:rgba(255,255,255,.12)}
#projects .prj-vista-barra button.on{background:#0b0d11}

/* ---- 7. modo lista sobre escuro ---- */
#projects .prj-carrossel.modo-lista{max-width:1180px;padding:0 20px !important}
#projects .prj-carrossel.modo-lista .prj-card{
  border:1px solid rgba(255,255,255,.08) !important;
  border-radius:12px;
}

@media(max-width:900px){
  #projects .prj-carrossel.modo-destaque .prj-grid{grid-template-columns:repeat(3,1fr) !important}
  #projects .modo-destaque .prj-destaque .prj-info{max-width:72%}
  #projects .modo-destaque .prj-card.prj-destaque{aspect-ratio:16/9;min-height:220px}
}
@media(max-width:560px){
  #projects .prj-carrossel.modo-destaque .prj-grid{grid-template-columns:repeat(2,1fr) !important}
  #projects .modo-destaque .prj-card.prj-destaque{aspect-ratio:4/3;min-height:0}
  #projects .modo-destaque .prj-destaque .prj-info{max-width:86%}
}

/* ===== bloco de entrada dos Projects - arranjo A2 =====
   Manchete a esquerda, explicacao e botao a direita. O texto antigo fica
   escondido (nao apagado) para o motor de traducoes continuar a mexer-lhe
   sem partir nada. */
#projects .tem-a2 p.prj-call-d,
#projects .tem-a2 .prj-call-note{display:none !important}
#projects .tem-a2 .prj-call-acts:empty{display:none !important}

#projects .prj-a2{
  display:grid;
  grid-template-columns:1.05fr 1fr;
  gap:clamp(26px,4vw,46px);
  align-items:center;
  max-width:1060px;
  margin:0 auto;
  padding:14px 20px 4px;
  text-align:left;
}
#projects .prj-a2-risco{
  width:52px;height:3px;background:var(--yellow,#F2C230);
  border-radius:2px;margin-bottom:18px;
}
#projects .prj-a2-tit{
  font-family:'Racing Sans One',Impact,sans-serif;
  font-style:italic;
  color:#ffffff;
  margin:0;
  font-size:clamp(27px,3.6vw,42px);
  line-height:1.06;
  letter-spacing:.5px;
  text-transform:none;
}
#projects .prj-a2-sub{
  color:#aeb6c2;
  font-size:clamp(15px,1.7vw,16.5px);
  line-height:1.7;
  font-weight:200;
  margin:0 0 22px;
}
#projects .prj-a2-acto{display:block}
#projects .prj-a2-acto .prj-add-btn{
  width:100%;
  justify-content:center;
  padding:16px 26px !important;
  font-size:13.5px !important;
  letter-spacing:1.4px !important;
}
#projects .prj-a2-selo{
  margin-top:13px;
  font-size:10.5px;
  letter-spacing:2px;
  text-transform:uppercase;
  color:#7f8794;
  font-weight:400;
}
#projects .prj-a2-selo b{color:var(--yellow,#F2C230);font-weight:600}

@media(max-width:820px){
  #projects .prj-a2{grid-template-columns:1fr;gap:20px;text-align:center}
  #projects .prj-a2-risco{margin-left:auto;margin-right:auto}
  #projects .prj-a2-sub{margin-bottom:18px}
}

/* o contentor antigo limitava a 820px: era isso que apertava o bloco */
#projects .prj-call-in.tem-a2,
#projects .prj-call-in:has(.prj-a2){max-width:1100px !important}
#projects .prj-cartao:has(.prj-a2){max-width:1100px !important;width:100% !important}
#projects .prj-a2{max-width:1020px}
#projects .prj-a2-selo{line-height:1.65}

/* ===== conta e painel: mesmo espacamento das outras paginas =====
   A regra base da la .section-body um padding-top de calc(19vw + 15px) - 288px
   num ecra de 1440 - porque nas paginas antigas a faixa ficava por tras. As
   paginas que levaram capa de video anulam esse padding (catalog, dyno,
   about); a conta e o painel nao o faziam, e ficavam com um bloco preto
   enorme por cima do titulo. */
#cat-account.tem-capa-video .section-body,
#cat-admin.tem-capa-video .section-body{padding-top:0 !important}

/* o painel tinha uma regra antiga a esconder QUALQUER .section-band, e por
   isso a capa de video nao aparecia - ficava um vazio branco no topo. */
#cat-admin.tem-capa-video > .section-band.capa-band{display:block !important}

/* ===== a capa dos Projects com a mesma altura das outras paginas =====
   As capas do catalogo, dos veiculos, do About e do Dinamometro usam
   aspect-ratio 1920/400 - 300px num ecra de 1440. A dos Projects estava em
   clamp(200px,34vw,420px), ou seja 420px, e ficava um palmo mais alta.
   Passa a seguir exactamente a mesma proporcao, para crescer e encolher
   com o ecra ao mesmo ritmo que as outras. */
#projects .prj-hero.capa{
  height:auto !important;
  min-height:0 !important;
  aspect-ratio:1920 / 400;
}

/* ===== CORRECCAO 14/10/2026: titulo ilegivel na conta e no painel =====
   Ao anular o padding do corpo, o titulo passou a assentar sobre a faixa -
   que e o comportamento certo e e o que o catalogo faz. O que faltava era a
   COR: o branco do titulo vem de ".tem-faixa-video", uma classe que o modulo
   de medicao so poe quando consegue medir a seccao duas vezes seguidas com o
   mesmo valor. Na conta e no painel isso nao acontece (a seccao so existe
   depois de entrar), e o titulo ficava quase preto por cima do video.
   Aqui as cores ficam presas a "tem-capa-video", que e posta uma vez e nunca
   mais muda - nao ha medicao nenhuma envolvida, logo nao ha nada a piscar. */
#cat-account.tem-capa-video .section-body > h2,
#cat-admin.tem-capa-video .section-body > h2{
  position:relative;
  z-index:2;
  color:#ffffff !important;
  background:transparent !important;
  border-bottom-color:transparent !important;
  text-align:center;
  text-shadow:0 2px 18px rgba(0,0,0,.85);
}
#cat-account.tem-capa-video .section-body > .eyebrow,
#cat-admin.tem-capa-video .section-body > .eyebrow{
  position:relative;
  z-index:2;
  color:var(--yellow,#F2C230) !important;
  background:transparent !important;
  border-top-color:transparent !important;
  text-align:center;
  text-shadow:0 2px 12px rgba(0,0,0,.85);
}
/* a faixa de carbono tem de ficar POR TRAS do titulo, nunca por cima */
#cat-account.tem-capa-video > .tit-video,
#cat-admin.tem-capa-video > .tit-video{z-index:0}

/* A CAUSA do titulo em cima do video: no catalogo a capa e position:relative,
   ocupa espaco, e o corpo comeca depois dela. Na conta e no painel a capa
   herdava position:absolute das paginas de marca - nao ocupa espaco nenhum -
   por isso, com o padding do corpo a zero, o titulo subiu para cima do video.
   Passa a relative, como no catalogo. */
#cat-account.tem-capa-video > .section-band.capa-band,
#cat-admin.tem-capa-video > .section-band.capa-band{
  position:relative !important;
  display:block !important;
}

/* a capa da conta e do painel estava encaixada dentro da largura da seccao,
   e sobravam duas tiras brancas nos lados. Passa a ocupar a janela toda,
   com a mesma tecnica que a capa dos Projects ja usava. */
#cat-account.tem-capa-video > .section-band.capa-band,
#cat-admin.tem-capa-video > .section-band.capa-band{
  width:100vw !important;
  max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;
}

/* 14/10/2026: o Braga mandou tirar a saudacao da conta. Mostrava o nome da
   conta ("Hinsei Hanta Exclusive Motors") onde devia estar a loja, e nao
   acrescentava nada - o nome ja aparece no cartao do lado esquerdo.
   Fica escondida, nao apagada: o elemento continua a existir para o resto
   do codigo que lhe mexe no texto nao rebentar. */
#cat-account #acct-hello{display:none !important}

/* ===== Advisor: mesma capa, mesma faixa, mesmas linhas douradas =====
   Esta pagina tinha banner proprio (.eg-banner), encaixado nos 80px de
   margem da seccao - por isso sobrava branco dos dois lados. Passa a usar a
   capa de video das outras paginas; o banner antigo sai, como ja acontece
   no About com o .story-banner. */
#cat-advisor.tem-capa-video .eg-banner{display:none !important}
#cat-advisor.tem-capa-video .section-body{padding-top:0 !important}
#cat-advisor.tem-capa-video > .section-band.capa-band{
  position:relative !important;
  display:block !important;
  width:100vw !important;
  max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;
}
#cat-advisor.tem-capa-video .section-body > h2{
  position:relative; z-index:2;
  color:#ffffff !important;
  background:transparent !important;
  border-bottom-color:transparent !important;
  text-align:center;
  text-shadow:0 2px 18px rgba(0,0,0,.85);
}
#cat-advisor.tem-capa-video .section-body > .eyebrow{
  position:relative; z-index:2;
  color:var(--yellow,#F2C230) !important;
  background:transparent !important;
  border-top-color:transparent !important;
  text-align:center;
  text-shadow:0 2px 12px rgba(0,0,0,.85);
}
#cat-advisor.tem-capa-video > .tit-video{z-index:0}

/* ============================================================
BLOCO 84 (CSS) - Expert Guide: carrossel + lista com imagens
   15/10/2026
   Geometria aqui nao esta presa a .tem-faixa-video, por isso nao
   entra no ciclo medir-marcar-piscar da faixa de video.
   ============================================================ */
#adv-app .adv-vista-bar,
#guia-saber .adv-vista-bar{
  max-width:900px;margin:0 auto 10px;display:flex;align-items:center;
  justify-content:space-between;gap:12px
}
#adv-app .adv-vista-tog,
#guia-saber .adv-vista-tog{
  display:inline-flex;border:1px solid var(--line);border-radius:999px;
  overflow:hidden;background:rgba(255,255,255,.04)
}
#adv-app .adv-vista-tog button,
#guia-saber .adv-vista-tog button{
  appearance:none;background:transparent;border:0;cursor:pointer;
  font-family:'Oswald',sans-serif;font-weight:600;font-size:12px;
  letter-spacing:.08em;text-transform:uppercase;color:#aeb3bd;
  padding:8px 18px;transition:.16s
}
#adv-app .adv-vista-tog button:hover,
#guia-saber .adv-vista-tog button:hover{color:#fff}
#adv-app .adv-vista-tog button.on,
#guia-saber .adv-vista-tog button.on{background:var(--yellow);color:#111}
#adv-app .adv-vista-nav,
#guia-saber .adv-vista-nav{display:flex;gap:8px}
#adv-app .adv-nav,
#guia-saber .adv-nav{
  appearance:none;width:34px;height:34px;border-radius:50%;cursor:pointer;
  border:1px solid var(--line);background:rgba(255,255,255,.05);
  color:var(--yellow);font-size:20px;line-height:1;transition:.16s
}
#adv-app .adv-nav:hover,
#guia-saber .adv-nav:hover{border-color:var(--yellow);background:rgba(242,194,48,.12)}

/* ---------- carrossel ---------- */
#adv-app .adv-opts.adv-car,
#guia-saber .adv-opts.adv-car{
  display:flex !important;grid-template-columns:none !important;
  overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;
  gap:14px;padding:2px 2px 12px;scrollbar-width:none;-ms-overflow-style:none
}
#adv-app .adv-opts.adv-car::-webkit-scrollbar,
#guia-saber .adv-opts.adv-car::-webkit-scrollbar{display:none}
/* flex-grow/shrink/basis em separado: a forma curta "flex:0 0 clamp(...)"
   e ambigua para o navegador, a declaracao caia toda e os cartoes
   encolhiam ate 87px quando eram muitos. */
#adv-app .adv-opts.adv-car > .adv-opt,
#guia-saber .adv-opts.adv-car > .adv-opt{
  flex-grow:0;flex-shrink:0;flex-basis:clamp(230px,27%,300px);
  scroll-snap-align:start;min-height:150px
}
#adv-app .adv-opts.adv-car.cabe > .adv-opt,
#guia-saber .adv-opts.adv-car.cabe > .adv-opt{flex-grow:1;flex-shrink:1;flex-basis:0;min-width:190px}
/* o .adv-opt traz "transition:.18s" para TUDO; ao mudar de vista isso punha
   a largura a deslizar e as medicoes saiam erradas. Fica so cor e realce,
   que e o que interessa ao passar o rato. */
#adv-app .adv-opts.adv-car > .adv-opt,
#adv-app .adv-opts.adv-lista > .adv-opt,
#guia-saber .adv-opts.adv-car > .adv-opt,
#guia-saber .adv-opts.adv-lista > .adv-opt{
  transition-property:border-color,box-shadow,transform,opacity,background-color
}

/* ---------- cartoes altos, o G1 que o Braga escolheu ----------
   Foto em pe (3/4), veu escuro a subir do fundo, titulo e frase por cima
   e o "+" dourado no canto - as mesmas medidas do exemplo aprovado. */
#adv-app .adv-opts.adv-car > .adv-opt.has-img,
#guia-saber .adv-opts.adv-car > .adv-opt.has-img{
  aspect-ratio:3/4;min-height:0;height:auto;border-radius:13px;padding:0;
  justify-content:flex-end;border:1px solid rgba(255,255,255,.1)
}
#adv-app .adv-opts.adv-car > .adv-opt .adv-opt-grad,
#guia-saber .adv-opts.adv-car > .adv-opt .adv-opt-grad{
  background:linear-gradient(180deg,rgba(8,9,12,.15) 25%,rgba(8,9,12,.93) 100%)
}
#adv-app .adv-opts.adv-car > .adv-opt .adv-opt-grad::after,
#guia-saber .adv-opts.adv-car > .adv-opt .adv-opt-grad::after{
  content:'+';position:absolute;top:12px;right:12px;width:26px;height:26px;
  border-radius:50%;background:rgba(242,194,48,.92);color:#15140c;
  display:grid;place-items:center;font-weight:700;font-size:15px;line-height:1
}
#adv-app .adv-opts.adv-car > .adv-opt .t,
#guia-saber .adv-opts.adv-car > .adv-opt .t{
  padding:0 15px;margin:0 0 5px;font-size:15.5px;line-height:1.25
}
#adv-app .adv-opts.adv-car > .adv-opt .d,
#guia-saber .adv-opts.adv-car > .adv-opt .d{
  padding:0 15px 16px;margin:0;font-size:11.5px;line-height:1.45;
  color:#b7bec9;opacity:1
}

/* ===== O Braga (15/10/2026): Expert Guide em fundo claro =====
   Primeiro pus a seccao toda escura para bater certo com o exemplo G1.
   O Braga viu e preferiu fundo claro: a pagina deixa de ser um bloco
   preto e os quadros ganham contraste - cartoes escuros com fotografia
   sobre painel branco. Os cartoes nao mudam, muda o que esta por tras.
   O titulo do passo volta a texto escuro (era branco sobre branco). */
#cat-advisor .section-body{background:transparent !important}
#cat-advisor .adv-q{color:#11151c !important}
#cat-advisor .adv-q .n{color:#111 !important}

/* o painel dos passos: quadro branco com relevo */
#cat-advisor #adv-app{
  background:#ffffff;border:1px solid rgba(12,16,24,.10);
  border-radius:16px;padding:26px 24px 30px;
  box-shadow:0 18px 44px -28px rgba(12,16,24,.45)
}
#cat-advisor .sec-count{
  background:transparent !important;color:#3c4350 !important;
  border-color:rgba(12,16,24,.12) !important
}

/* barra de vistas e setas sobre branco */
#adv-app .adv-vista-tog,
#guia-saber .adv-vista-tog{border-color:rgba(12,16,24,.14);background:rgba(12,16,24,.03)}
#adv-app .adv-vista-tog button,
#guia-saber .adv-vista-tog button{color:#5b6372}
#adv-app .adv-vista-tog button:hover,
#guia-saber .adv-vista-tog button:hover{color:#11151c}
#adv-app .adv-nav,
#guia-saber .adv-nav{
  border-color:rgba(12,16,24,.16);background:#fff;color:#8a6c12;
  box-shadow:0 6px 16px -10px rgba(12,16,24,.5)
}
#adv-app .adv-nav:hover,
#guia-saber .adv-nav:hover{border-color:var(--yellow);background:#fffbef}


/* ---------- lista (imagens como no G3) ----------
Em grelha e nao em flex: o .adv-opt.has-img ja traz
   flex-direction:column e justify-content:flex-end,
e a soma dos dois
   atirava a foto e o texto para o canto direito da linha. */
#adv-app .adv-opts.adv-lista,
#guia-saber .adv-opts.adv-lista{
  display:flex !important;grid-template-columns:none !important;
  flex-direction:column;gap:10px;overflow:visible
}
#adv-app .adv-opts.adv-lista > .adv-opt,
#guia-saber .adv-opts.adv-lista > .adv-opt{
  display:grid !important;
  grid-template-columns:168px minmax(0,1fr);
  grid-template-rows:auto auto;
  align-content:center;justify-items:start;
  min-height:104px;padding:0 44px 0 0;text-align:left;overflow:hidden;
  background-color:rgba(255,255,255,.035) !important
}
#adv-app .adv-opts.adv-lista > .adv-opt .adv-thumb,
#guia-saber .adv-opts.adv-lista > .adv-opt .adv-thumb{
  grid-column:1;grid-row:1 / span 2;align-self:stretch;
  width:168px;height:112px;object-fit:cover;display:block;
  border-right:1px solid var(--line)
}
#adv-app .adv-opts.adv-lista > .adv-opt .adv-opt-grad,
#guia-saber .adv-opts.adv-lista > .adv-opt .adv-opt-grad{display:none}
#adv-app .adv-opts.adv-lista > .adv-opt .t,
#guia-saber .adv-opts.adv-lista > .adv-opt .t{
  grid-column:2;grid-row:1;font-size:17px;padding:0 0 0 20px;align-self:end
}
#adv-app .adv-opts.adv-lista > .adv-opt .d,
#guia-saber .adv-opts.adv-lista > .adv-opt .d{
  grid-column:2;grid-row:2;margin-top:4px;padding:0 0 0 20px;
  max-width:620px;align-self:start
}
#adv-app .adv-opts.adv-lista > .adv-opt::after,
#guia-saber .adv-opts.adv-lista > .adv-opt::after{
  content:'\203A';position:absolute;right:18px;top:50%;transform:translateY(-50%);
  color:var(--yellow);font-size:22px;opacity:.55;transition:.16s
}
#adv-app .adv-opts.adv-lista > .adv-opt:hover,
#guia-saber .adv-opts.adv-lista > .adv-opt:hover{transform:none;border-color:var(--yellow)}
#adv-app .adv-opts.adv-lista > .adv-opt:hover::after,
#guia-saber .adv-opts.adv-lista > .adv-opt:hover::after{opacity:1;right:13px}

@media(max-width:640px){
#adv-app .adv-vista-bar,
#guia-saber .adv-vista-bar{max-width:100%;padding:0 2px}
#adv-app .adv-opts.adv-car > .adv-opt,
#guia-saber .adv-opts.adv-car > .adv-opt{flex:0 0 78%}
#adv-app .adv-opts.adv-lista > .adv-opt,
#guia-saber .adv-opts.adv-lista > .adv-opt{grid-template-columns:108px minmax(0,1fr);min-height:86px;padding-right:30px}
#adv-app .adv-opts.adv-lista > .adv-opt .adv-thumb,
#guia-saber .adv-opts.adv-lista > .adv-opt .adv-thumb{width:108px;min-height:86px}
#adv-app .adv-opts.adv-lista > .adv-opt .t,
#guia-saber .adv-opts.adv-lista > .adv-opt .t,
#adv-app .adv-opts.adv-lista > .adv-opt .d,
#guia-saber .adv-opts.adv-lista > .adv-opt .d{padding-left:12px}
#adv-app .adv-opts.adv-lista > .adv-opt .t,
#guia-saber .adv-opts.adv-lista > .adv-opt .t{font-size:15px}
#adv-app .adv-opts.adv-lista > .adv-opt .d,
#guia-saber .adv-opts.adv-lista > .adv-opt .d{font-size:11.5px}
}

/* ============================================================
   BLOCO 85 (CSS) - base de saber do Expert Guide
   15/10/2026 - mesma linguagem do G1: escuro, linha dourada,
   cartao alto. A capa da marca e para os temas que ainda nao tem
   fotografia real; e fibra de carbono, nao uma foto inventada.
   ============================================================ */
#guia-saber{max-width:1100px;margin:40px auto 10px;padding:0 10px}
#guia-saber .gs-topo{text-align:center;margin:0 0 26px}
#guia-saber .gs-eyebrow{
  font-family:'Oswald',sans-serif;font-size:11.5px;letter-spacing:.22em;
  color:var(--yellow);text-transform:uppercase
}
#guia-saber .gs-topo h3{
  font-family:'Oswald',sans-serif;font-size:30px;color:#11151c;margin:8px 0 6px;
  letter-spacing:.02em
}
#guia-saber .gs-topo p{color:#5b6372;font-size:14px;margin:0;line-height:1.5}

#guia-saber .gs-grupo{
  background:#ffffff;border:1px solid rgba(12,16,24,.10);border-radius:16px;
  padding:22px 22px 26px;margin:0 0 22px;
  box-shadow:0 18px 44px -28px rgba(12,16,24,.45)
}
#guia-saber .gs-cab{margin:0 0 14px;text-align:center}
#guia-saber .gs-cab h4{
  font-family:'Oswald',sans-serif;font-size:19px;color:#11151c;margin:0 0 4px;
  text-transform:uppercase;letter-spacing:.05em
}
#guia-saber .gs-cab h4::after{
  content:'';display:block;width:54px;height:2px;background:var(--yellow);
  margin:9px auto 0;border-radius:2px
}
#guia-saber .gs-cab p{color:#6b7280;font-size:12.5px;margin:8px 0 0}

/* as tiras herdam tudo do bloco 84; so o limite de largura muda */
#guia-saber .adv-opts{max-width:100%}
#guia-saber .adv-vista-bar{max-width:100%}

/* ---- capa da marca, para o tema que ainda nao tem fotografia ---- */
#guia-saber .adv-opt.sem-foto{
  background-color:#10131a !important;
  background-image:
    linear-gradient(135deg,rgba(255,255,255,.045) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.045) 50%,rgba(255,255,255,.045) 75%,transparent 75%),
    linear-gradient(180deg,#171b24 0%,#0d1016 100%) !important;
  background-size:8px 8px, 100% 100% !important;
  background-position:0 0, 0 0 !important
}
#guia-saber .adv-opt.sem-foto .adv-opt-grad{
  background:linear-gradient(180deg,rgba(8,9,12,0) 35%,rgba(8,9,12,.82) 100%) !important
}
/* a marca so no cartao alto; na lista o ::after e a seta dourada */
#guia-saber .adv-opts.adv-car > .adv-opt.sem-foto::after{
  content:'BLACKLIST';position:absolute;left:0;right:0;top:38%;
  transform:translateY(-50%);text-align:center;z-index:1;
  font-family:'Oswald',sans-serif;font-size:13px;letter-spacing:.3em;
  color:rgba(242,194,48,.75)
}
/* na lista, a coluna da esquerda fica com a textura da marca em vez da foto */
#guia-saber .adv-opts.adv-lista > .adv-opt.sem-foto::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:168px;opacity:1;
  border-right:1px solid var(--line);z-index:1;
  background:
    linear-gradient(135deg,rgba(255,255,255,.05) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.05) 50%,rgba(255,255,255,.05) 75%,transparent 75%),
    linear-gradient(180deg,#171b24,#0d1016);
  background-size:8px 8px, 100% 100%
}
#guia-saber .adv-opts.adv-lista > .adv-opt.sem-foto .t,
#guia-saber .adv-opts.adv-lista > .adv-opt.sem-foto .d{position:relative;z-index:2}

/* ---- painel do tema ---- */
#guia-saber .gs-painel{
  margin:18px 0 0;background:#0b0e13;border:1px solid rgba(242,194,48,.28);
  border-radius:14px;padding:0;overflow:hidden
}
#guia-saber .gs-painel[hidden]{display:none}
#guia-saber .gs-p-cab{
  display:flex;align-items:flex-start;justify-content:space-between;gap:16px;
  padding:18px 20px 14px;border-bottom:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg,rgba(242,194,48,.08),transparent)
}
#guia-saber .gs-p-grupo{
  font-family:'Oswald',sans-serif;font-size:10.5px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--yellow)
}
#guia-saber .gs-p-cab h4{
  font-family:'Oswald',sans-serif;font-size:21px;color:#fff;margin:5px 0 3px
}
#guia-saber .gs-p-cab p{color:#9aa1ad;font-size:12.5px;margin:0}
#guia-saber .gs-fechar{
  appearance:none;background:transparent;border:1px solid rgba(255,255,255,.18);
  color:#c7ccd6;width:30px;height:30px;border-radius:50%;cursor:pointer;
  font-size:19px;line-height:1;flex:none;transition:.16s
}
#guia-saber .gs-fechar:hover{border-color:var(--yellow);color:var(--yellow)}
#guia-saber .gs-p-corpo{padding:6px 20px 4px}
#guia-saber .gs-sec{padding:14px 0;border-bottom:1px solid rgba(255,255,255,.06)}
#guia-saber .gs-sec:last-child{border-bottom:0}
#guia-saber .gs-sec h5{
  font-family:'Oswald',sans-serif;font-size:15px;color:var(--yellow);
  margin:0 0 8px;letter-spacing:.02em
}
#guia-saber .gs-sec ul{margin:0;padding:0 0 0 18px}
#guia-saber .gs-sec li{
  color:#c9ced8;font-size:13.5px;line-height:1.62;margin:0 0 6px
}
#guia-saber .gs-sec li:last-child{margin-bottom:0}
#guia-saber .gs-p-pe{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  padding:14px 20px 18px;border-top:1px solid rgba(255,255,255,.08)
}
#guia-saber .gs-ver{
  appearance:none;background:var(--yellow);color:#111;border:0;cursor:pointer;
  font-family:'Oswald',sans-serif;font-weight:600;font-size:13px;
  letter-spacing:.06em;text-transform:uppercase;padding:10px 20px;border-radius:999px;
  transition:.16s
}
#guia-saber .gs-ver:hover{filter:brightness(1.08)}
#guia-saber .gs-p-pe > span{color:#8d94a0;font-size:11.5px}

#guia-saber .gs-card.on{box-shadow:0 0 0 2px var(--yellow),0 14px 34px -12px rgba(242,194,48,.55)}

@media(max-width:640px){
  #guia-saber{margin-top:28px;padding:0 4px}
  #guia-saber .gs-topo h3{font-size:23px}
  #guia-saber .gs-grupo{padding:16px 12px 20px;border-radius:13px}
  #guia-saber .gs-p-cab{padding:14px 14px 12px}
  #guia-saber .gs-p-corpo{padding:4px 14px}
  #guia-saber .gs-sec li{font-size:13px}
  #guia-saber .gs-p-pe{padding:12px 14px 16px}
}

/* ===== O Braga (15/10/2026): contraste dos quadros no fundo claro =====
   O painel de cada tema fica escuro de proposito: e o unico bloco escuro
   da pagina clara, por isso e para onde o olho vai quando se abre um
   tema. Os cartoes tambem sao escuros - e esse o contraste que ele pediu. */
#guia-saber .gs-painel{
  background:#0e1218;border-color:rgba(12,16,24,.18);
  box-shadow:0 26px 60px -34px rgba(12,16,24,.8)
}
#guia-saber .gs-p-cab{
  background:linear-gradient(180deg,rgba(242,194,48,.14),transparent);
  border-bottom-color:rgba(255,255,255,.10)
}
/* o cartao escolhido salta do painel branco */
#guia-saber .gs-card{box-shadow:0 14px 30px -20px rgba(12,16,24,.75)}
#guia-saber .gs-card:hover{box-shadow:0 20px 40px -18px rgba(12,16,24,.85)}
#guia-saber .gs-card.on{
  box-shadow:0 0 0 2px var(--yellow),0 18px 40px -16px rgba(242,194,48,.55)
}
/* na vista de lista as linhas tambem precisam de se ver no branco */
#guia-saber .adv-opts.adv-lista > .adv-opt{
  background-color:#11151c !important;border-color:rgba(12,16,24,.18) !important
}
#adv-app .adv-opts.adv-lista > .adv-opt{
  background-color:#11151c !important;border-color:rgba(12,16,24,.18) !important
}

/* ===== O Braga (15/10/2026): ligacao do saber aos produtos =====
   Por tema, a seccao do catalogo e as marcas que vendem mesmo aquilo.
   Nenhuma destas marcas e inventada: sao as que ja estao no catalogo e
   que o conselheiro ja usava. O aviso de aplicacao fica sempre a vista. */
#guia-saber .gs-p-pe{align-items:flex-start;flex-direction:column;gap:10px}
#guia-saber .gs-marcas{
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;flex:0 0 auto;width:100%
}
#guia-saber .gs-marca{
  appearance:none;background:rgba(255,255,255,.05);color:#e7eaf0;cursor:pointer;
  border:1px solid rgba(255,255,255,.18);border-radius:999px;
  font-size:12px;padding:7px 14px;transition:.16s;white-space:nowrap
}
#guia-saber .gs-marca:hover{border-color:var(--yellow);color:var(--yellow);background:rgba(242,194,48,.10)}
#guia-saber .gs-aviso{color:#8d94a0;font-size:11.5px;flex:0 0 auto}

/* ===== O Braga (15/10/2026): manual em PDF por tema ===== */
#guia-saber .gs-p-pdf{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  padding:14px 20px;border-bottom:1px solid rgba(255,255,255,.08);
  background:rgba(242,194,48,.06)
}
#guia-saber .gs-baixar{
  display:inline-flex;align-items:center;gap:9px;text-decoration:none;
  background:var(--yellow);color:#111;border-radius:999px;
  font-family:'Oswald',sans-serif;font-weight:600;font-size:13px;
  letter-spacing:.05em;text-transform:uppercase;padding:10px 20px;transition:.16s
}
#guia-saber .gs-baixar:hover{filter:brightness(1.08);transform:translateY(-1px)}
#guia-saber .gs-p-pdf span{color:#9aa1ad;font-size:11.5px;flex:1 1 220px}
@media(max-width:640px){
  #guia-saber .gs-p-pdf{padding:12px 14px}
  #guia-saber .gs-baixar{width:100%;justify-content:center}
}

/* ===== O Braga (15/10/2026): as tiras do saber andam sempre =====
   Sem encaixe de cartao a cartao: com scroll-snap o navegador puxava
   a tira de volta ao cartao mais proximo e o movimento ficava aos
   solavancos. Aqui a rolagem e livre, e as copias dos cartoes fazem
   a volta parecer infinita. */
#guia-saber .adv-opts.adv-car.rola-sempre,
#adv-app .adv-opts.adv-car.rola-sempre{
  scroll-snap-type:none !important;
  scroll-behavior:auto !important
}
#guia-saber .adv-opts.adv-car.rola-sempre > .adv-opt,
#adv-app .adv-opts.adv-car.rola-sempre > .adv-opt{scroll-snap-align:none !important}
@media(prefers-reduced-motion: reduce){
  #guia-saber .adv-opts.adv-car.rola-sempre,
  #adv-app .adv-opts.adv-car.rola-sempre{scroll-behavior:smooth !important}
}

/* ============================================================
   O Braga (15/10/2026): pagina de CONTACTO
   1) A capa passa a ser a mesma das outras paginas: video da
      BLACKLIST colado a faixa de fibra de carbono com as linhas
      douradas por tras do titulo.
   2) Os dois quadros (o do CEO e o do formulario) tinham fundo
      transparente com letra clara - sobre a pagina branca o texto
      desaparecia. Passam a quadro escuro, que e o contraste que
      falta e a mesma linguagem do Expert Guide.
   ============================================================ */
#cat-contact.tem-capa-video .section-body{padding-top:0 !important}
#cat-contact.tem-capa-video > .section-band.capa-band{
  position:relative !important; display:block !important;
  width:100vw !important; max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important; margin-right:calc(50% - 50vw) !important
}

/* --- quadros com contraste --- */
#cat-contact .collab-card,
#cat-contact .cform-box{
  background:#0e1218 !important;
  border-color:rgba(242,194,48,.55) !important;
  box-shadow:0 26px 60px -34px rgba(12,16,24,.85) !important
}
#cat-contact .collab-title{color:#8a6c12 !important}
#cat-contact .collab-name{color:var(--yellow) !important}
#cat-contact .collab-role{color:#ffffff !important}
#cat-contact .collab-line,
#cat-contact .collab-line a{color:#e6e9ef !important}
#cat-contact .collab-line a:hover{color:var(--yellow) !important}
#cat-contact .collab-langs{color:#9aa1ad !important}
#cat-contact .cform-title,
#cat-contact .cform-box h3,
#cat-contact .cform-box label{color:#ffffff !important}
#cat-contact .cform-box .cform-sub,
#cat-contact .cform-box small{color:#9aa1ad !important}

/* ============================================================
   O Braga escolheu o desenho D1 para o CONTACTO (15/10/2026)
   Metade do bloco e a fotografia dele, de cima a baixo, com os
   dados escritos por cima do escuro; a outra metade e so o
   formulario. Os dois encostados, numa so caixa com borda
   dourada. Feito so com estilos - a marcacao do site fica igual,
   o que evita mexer no que ja funciona.
   ============================================================ */
#cat-contact .contact-page-wrap{
  grid-template-columns:1fr 1fr !important;
  gap:0 !important;
  max-width:1120px;margin:0 auto !important;
  border:1px solid rgba(242,194,48,.5);border-radius:16px;overflow:hidden;
  align-items:stretch;
  box-shadow:0 30px 70px -40px rgba(12,16,24,.9)
}
/* a coluna da esquerda passa a ser so a fotografia */
#cat-contact .contact-page-wrap > div:first-child{display:flex;min-width:0}
#cat-contact .collab-title{display:none !important}
#cat-contact .collab-card{
  position:relative !important;display:flex !important;flex-direction:column;
  justify-content:flex-end;width:100%;min-height:540px;
  padding:0 !important;border:0 !important;border-radius:0 !important;
  background:#0B0D11 !important;overflow:hidden;box-shadow:none !important
}
#cat-contact .collab-photo{
  position:absolute !important;inset:0 !important;
  width:100% !important;height:100% !important;border-radius:0 !important;
  margin:0 !important;background:#0B0D11 !important
}
#cat-contact .collab-photo img{
  width:100% !important;height:100% !important;
  /* no telemovel o site limita esta imagem a 150px e centra-a com margem;
     sem desligar isso a fotografia ficava uma tira ao meio do cartao */
  max-width:none !important;min-width:0 !important;margin:0 !important;
  object-fit:cover !important;object-position:22% center !important;
  border-radius:0 !important;display:block
}
/* o escurecido que deixa o texto ler-se e cola a foto ao formulario */
#cat-contact .collab-card::after{
  content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,rgba(8,9,12,.86) 0%,rgba(8,9,12,.40) 52%,rgba(14,18,24,.97) 100%)
}
#cat-contact .collab-card > div:last-of-type{
  position:relative;z-index:2;padding:30px 32px 30px
}
#cat-contact .collab-name{font-size:30px !important;line-height:1.05}
#cat-contact .collab-role{margin:5px 0 18px !important;letter-spacing:.18em}
#cat-contact .collab-line{margin-bottom:9px}
#cat-contact .collab-langs{margin-top:14px !important;font-style:italic}

/* a coluna da direita e so o formulario, encostado a fotografia */
#cat-contact .cform-box{
  background:#0E1218 !important;border:0 !important;border-radius:0 !important;
  padding:34px 34px 36px !important;box-shadow:none !important;
  display:flex;flex-direction:column;justify-content:center
}
#cat-contact .cform-box::before{
  content:'';display:block;width:62px;height:2px;background:var(--yellow);margin:0 0 16px
}
#cat-contact .cform-box h3{text-align:left !important;margin:0 0 14px !important}

@media(max-width:860px){
  #cat-contact .contact-page-wrap{grid-template-columns:1fr !important;border-radius:14px}
  #cat-contact .collab-card{min-height:380px}
  /* no telemovel o texto fica POR CIMA da fotografia toda, e a parte de
     cima da imagem e clara (o para-brisas). Escurece-se mais, senao o
     nome e os contactos nao se leem. */
  #cat-contact .collab-card::after{
    background:linear-gradient(180deg,rgba(8,9,12,.74) 0%,rgba(8,9,12,.80) 45%,rgba(8,9,12,.96) 100%)
  }
  #cat-contact .collab-photo img{object-position:26% 28% !important}
  #cat-contact .collab-card > div:last-of-type{padding:22px 20px}
  #cat-contact .collab-name{font-size:25px !important}
  #cat-contact .cform-box{padding:26px 20px 28px !important}
}

/* os campos do formulario tambem escuros, como no desenho aprovado:
   brancos sobre o painel preto cortavam o bloco ao meio */
#cat-contact .cform-box input,
#cat-contact .cform-box select,
#cat-contact .cform-box textarea{
  background:rgba(255,255,255,.05) !important;
  border:1px solid rgba(255,255,255,.14) !important;
  color:#ffffff !important;border-radius:9px !important
}
#cat-contact .cform-box input::placeholder,
#cat-contact .cform-box textarea::placeholder{color:#8B93A0 !important}
#cat-contact .cform-box input:focus,
#cat-contact .cform-box textarea:focus{
  border-color:var(--yellow) !important;background:rgba(255,255,255,.07) !important;outline:none !important
}

/* ===== separador "Contact" do painel de administracao (16/10/2026) ===== */
#ap-contact .ct-cab h3{
  font-family:'Oswald',sans-serif;font-size:18px;letter-spacing:.04em;margin:0 0 6px;color:#fff
}
#ap-contact .ct-cab p{color:#9aa1ad;font-size:13px;line-height:1.6;margin:0 0 16px;max-width:760px}
#ap-contact .ct-tab td{vertical-align:middle}
#ap-contact .ct-tab input[type=text],
#ap-contact .ct-tab input:not([type=checkbox]),
#ap-contact .ct-tab select{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.16);color:#fff;
  border-radius:7px;padding:8px 10px;font-size:13px;font-family:inherit
}
#ap-contact .ct-tab input:focus,#ap-contact .ct-tab select:focus{outline:none;border-color:var(--yellow)}
#ap-contact .ct-tab .ct-up,#ap-contact .ct-tab .ct-dn,#ap-contact .ct-tab .ct-del{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);color:#d7dce4;
  width:30px;height:30px;border-radius:7px;cursor:pointer;font-size:13px;line-height:1
}
#ap-contact .ct-tab .ct-del{color:#ff8a8a}
#ap-contact .ct-tab .ct-up:hover,#ap-contact .ct-tab .ct-dn:hover{border-color:var(--yellow);color:var(--yellow)}
#ap-contact .ct-tab .ct-del:hover{border-color:#ff8a8a}
#ap-contact .ct-pe{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:16px 0 0}
#ap-contact .ct-pe button{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.18);color:#e7eaf0;
  border-radius:999px;padding:10px 18px;cursor:pointer;font-family:'Oswald',sans-serif;
  font-size:12.5px;letter-spacing:.06em;text-transform:uppercase
}
#ap-contact .ct-pe .ct-pub{background:var(--yellow);border-color:var(--yellow);color:#15140c;font-weight:600}
#ap-contact .ct-pe button:hover{border-color:var(--yellow)}
#ap-contact .ct-msg{font-size:12.5px;color:#9aa1ad}

/* a bandeira da Europa e colorida: nao pode herdar o dourado dos outros icones */
#cat-contact .collab-line svg rect[fill],
#cat-contact .collab-line svg circle[fill]{stroke:none}

/* ===== tira de marcas por baixo do contacto (16/10/2026) =====
   Faixa escura a toda a largura: os logos da pasta logos/w sao
   claros e desapareciam no fundo branco da pagina. */
#marcas-tira{
  position:relative;width:100vw;max-width:100vw;
  margin:34px 0 0;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
  padding:30px 0 34px;overflow:hidden;
  border-top:2px solid var(--yellow);border-bottom:2px solid var(--yellow);
  background-image:
    linear-gradient(135deg,rgba(255,255,255,.035) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.035) 50%,rgba(255,255,255,.035) 75%,transparent 75%),
    linear-gradient(180deg,#141A22,#0B0E13);
  background-size:9px 9px,100% 100%
}
#marcas-tira .mt-topo{text-align:center;margin:0 0 20px;padding:0 20px}
#marcas-tira .mt-topo2{margin-top:30px}
#marcas-tira .mt-olho{
  font-family:'Oswald',sans-serif;font-size:11px;letter-spacing:.24em;color:var(--yellow)
}
#marcas-tira .mt-topo p{color:#9aa1ad;font-size:12.5px;margin:8px 0 0}
#marcas-tira .mt-tira{
  display:flex;align-items:center;gap:0;
  overflow-x:auto;overflow-y:hidden;
  scrollbar-width:none;-ms-overflow-style:none;
  scroll-behavior:auto;scroll-snap-type:none
}
#marcas-tira .mt-tira::-webkit-scrollbar{display:none}
#marcas-tira .mt-parada{justify-content:center;overflow:hidden}
/* a fila das casas do Braga: logos feitos para preto, placa escura */
#marcas-tira .mt-tira[data-g="meus"] .mt-logo{
  background:#0A0B0E;border-color:rgba(242,194,48,.42)
}
#marcas-tira .mt-tira[data-g="meus"] .mt-logo:hover{border-color:var(--yellow)}
#marcas-tira .mt-tira[data-g="meus"] .mt-logo{width:196px;height:94px}
#marcas-tira .mt-tira[data-g="meus"] .mt-logo img{max-height:64px;max-width:152px}
#marcas-tira .mt-tira{gap:14px;padding:0 14px}
#marcas-tira .mt-logo{
  flex:0 0 auto;display:flex;align-items:center;justify-content:center;
  width:176px;height:78px;margin:0;padding:0 16px;border-radius:11px;
  background:#ffffff;border:1px solid rgba(255,255,255,.10);cursor:pointer;
  transition:border-color .18s, transform .18s, box-shadow .18s
}
#marcas-tira .mt-logo:hover{
  border-color:var(--yellow);transform:translateY(-2px);
  box-shadow:0 14px 30px -18px rgba(0,0,0,.9)
}
#marcas-tira .mt-logo img{
  max-width:100%;max-height:46px;width:auto;height:auto;object-fit:contain;display:block
}
/* as pontas esbatem-se, para o movimento nao parecer cortado */
#marcas-tira::before,#marcas-tira::after{
  content:'';position:absolute;top:0;bottom:0;width:90px;z-index:2;pointer-events:none
}
#marcas-tira::before{left:0;background:linear-gradient(90deg,#0B0E13,rgba(11,14,19,0))}
#marcas-tira::after{right:0;background:linear-gradient(270deg,#0B0E13,rgba(11,14,19,0))}

@media(max-width:640px){
  #marcas-tira{padding:22px 0 26px;margin-top:26px}
  #marcas-tira .mt-logo{width:142px;height:66px;padding:0 12px}
  #marcas-tira .mt-tira[data-g="meus"] .mt-logo{width:158px;height:80px}
  #marcas-tira .mt-tira[data-g="meus"] .mt-logo img{max-height:52px;max-width:126px}
  #marcas-tira .mt-tira{gap:10px;padding:0 10px}
  #marcas-tira .mt-logo img{max-height:36px}
  #marcas-tira::before,#marcas-tira::after{width:46px}
}

/* ============================================================
   BLOCO 89 - pagina de musicas no desenho T2 ("mural de capas")
   16/10/2026
   Escolhido pelo Braga de entre seis desenhos. Os cinco jogos
   passam a cartazes com a capa a cores quando escolhidos, e as
   faixas ficam em duas colunas - cabe o dobro sem rolar.
   A ordem e por linha (01 02 / 03 04) e nao por coluna, porque
   a lista rola: por coluna obrigava a descer a esquerda toda e
   voltar a subir para ler a direita.
   ============================================================ */
#capa .mpanel{width:min(1060px,95vw) !important;height:min(86vh,820px) !important}

#capa .mp-albums{
  display:grid !important;grid-template-columns:repeat(5,1fr) !important;
  gap:12px !important;overflow:visible !important;padding:16px 20px 14px !important}
#capa .mp-album{
  flex:none !important;min-width:0 !important;display:block !important;
  padding:0 !important;text-align:left;overflow:hidden;
  background:#0D1117 !important;border:1px solid rgba(255,255,255,.12) !important;
  border-radius:12px !important;transition:border-color .18s,box-shadow .18s}
#capa .mp-album-c{display:block;width:100%;aspect-ratio:1/1;overflow:hidden;background:#07090C}
#capa .mp-album-c img{width:100%;height:100%;display:block;object-fit:cover;
  opacity:.5;filter:grayscale(.45);transition:opacity .18s,filter .18s}
#capa .mp-album:hover .mp-album-c img{opacity:.85;filter:grayscale(.12)}
#capa .mp-album.on .mp-album-c img{opacity:1;filter:none}
#capa .mp-album-t{display:block;padding:9px 11px}
#capa .mp-album .mp-album-g{display:block;font-size:14px;line-height:1.2;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff}
#capa .mp-album .mp-album-n{display:block;margin-top:1px}
#capa .mp-album.on{background:#0D1117 !important;border-color:var(--yellow) !important;
  box-shadow:0 0 0 1px var(--yellow),0 20px 44px -28px rgba(242,194,48,.9)}
#capa .mp-album.on .mp-album-g{color:var(--yellow) !important}
#capa .mp-album.on .mp-album-n{color:#9aa0aa !important}

#capa .mp-subs{padding:0 20px 12px !important}

#capa .mp-list{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 26px;align-content:start;
  padding:2px 20px 18px !important;border-top:1px solid rgba(255,255,255,.08)}
#capa .mp-list .mrow{
  padding:10px 10px !important;border-left:0 !important;border-radius:9px;
  border-bottom:1px solid rgba(255,255,255,.055)}
#capa .mp-list .mrow.active{border-left:0 !important;border-bottom-color:transparent;
  background:rgba(242,194,48,.12) !important}
#capa .mp-list .mp-empty{grid-column:1 / -1}

/* tablet: quatro cartazes por linha ainda cabem */
@media (max-width:980px){
  #capa .mp-albums{grid-template-columns:repeat(3,1fr) !important}
}
/* telemovel: cartazes em fila que se arrasta, faixas numa coluna */
@media (max-width:700px){
  #capa .mp-albums{display:flex !important;overflow-x:auto !important;
    scrollbar-width:none;padding:12px 14px !important;gap:10px !important}
  #capa .mp-albums::-webkit-scrollbar{display:none}
  #capa .mp-album{width:132px;flex:0 0 132px !important}
  #capa .mp-list{grid-template-columns:minmax(0,1fr);padding:2px 12px 14px !important}
  #capa .mp-subs{padding:0 14px 10px !important}
}

/* ===== BLOCO 90 - o aviso das musicas (mesmo desenho do 18+, em dourado) === */
.trax-dica-ov{z-index:100070 !important}
.trax-dica-ov .trax-dica-modal{
  max-width:480px;
  border-color:rgba(242,194,48,.45) !important;
  box-shadow:0 30px 90px -20px rgba(242,194,48,.30),
             0 0 0 1px rgba(255,255,255,.04) !important}
.trax-dica-ov .trax-dica-badge{
  background:linear-gradient(135deg,#F2C230,#ffd964) !important;
  color:#15140c !important;font-size:30px !important;line-height:1;
  box-shadow:0 10px 26px -8px rgba(242,194,48,.65) !important}
.trax-dica-ov .trax-dica-btn{
  background:linear-gradient(135deg,#F2C230,#ffd45e) !important;
  color:#15140c !important;
  box-shadow:0 10px 26px -10px rgba(242,194,48,.7) !important}
.trax-dica-ov .age-points span{line-height:1.45;display:flex;gap:9px}
@media(max-width:640px){
  .trax-dica-ov .trax-dica-btn{font-size:12.5px !important;letter-spacing:.2px}
  .trax-dica-ov .trax-dica-modal{padding:24px 18px !important}
  .trax-dica-ov .age-points{padding:12px 13px}
  .trax-dica-ov .age-points span{font-size:12px}
}
/* botao "?" ao lado de ALL / PLAYLIST, para rever a dica das musicas */
#capa .mp-head .trax-ajuda,.mp-head .trax-ajuda{
  width:30px;height:30px;flex:none;margin-left:2px;border-radius:50%;
  background:transparent;border:1px solid rgba(255,255,255,.22);
  color:#b8bdc6;font:600 14px 'Oswald',sans-serif;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center;padding:0;transition:.16s}
#capa .mp-head .trax-ajuda:hover,.mp-head .trax-ajuda:hover{
  border-color:var(--yellow);color:var(--yellow);background:rgba(242,194,48,.1)}

/* ============================================================
   O Braga (16/10/2026): ESCAPES - a mesma capa das outras
   paginas, a faixa de carbono com os riscos dourados por tras
   do titulo, e o texto a voltar a ver-se.
   Desde que o site passou a fundo branco esta pagina ficou com
   metade do texto branco sobre branco - o titulo do quadro de
   configuracao tinha contraste zero. As cores aqui sao so para
   o modo branco (body.teste-branco); o tema escuro fica como
   estava, para o dia em que se volte atras.
   ============================================================ */
#cat-exhausts.tem-capa-video .section-body{padding-top:0 !important}
#cat-exhausts.tem-capa-video > .section-band.capa-band{
  position:relative !important; display:block !important;
  width:100vw !important; max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important; margin-right:calc(50% - 50vw) !important
}
#cat-exhausts.tem-capa-video .section-body > h2{
  position:relative;z-index:2;color:#ffffff !important;background:transparent !important;
  border-bottom-color:transparent !important;text-align:center;
  text-shadow:0 2px 18px rgba(0,0,0,.85)
}
#cat-exhausts.tem-capa-video .section-body > .eyebrow{
  position:relative;z-index:2;color:var(--yellow,#F2C230) !important;background:transparent !important;
  border-top-color:transparent !important;text-align:center;
  text-shadow:0 2px 12px rgba(0,0,0,.85)
}
#cat-exhausts.tem-capa-video > .tit-video{z-index:0}

/* --- texto que se le em fundo branco --- */
body.teste-branco #cat-exhausts .ex-h{color:#8A6C12 !important}
body.teste-branco #cat-exhausts .ex-sub{color:#5C6270 !important}
body.teste-branco #cat-exhausts .ex-learn-h{color:#14171C !important}
body.teste-branco #cat-exhausts .ex-custom h3{color:#14171C !important;text-shadow:none !important}
body.teste-branco #cat-exhausts .ex-custom .lead{color:#454B57 !important}
body.teste-branco #cat-exhausts .ex-step{
  background:#FFFFFF !important;border:1px solid rgba(12,16,24,.14) !important;
  color:#454B57 !important;box-shadow:0 10px 26px -20px rgba(12,16,24,.45) !important
}
body.teste-branco #cat-exhausts .ex-step b{color:#14171C !important}
body.teste-branco #cat-exhausts .ex-notice{
  background:rgba(210,31,31,.07) !important;border-color:rgba(210,31,31,.35) !important;
  color:#8E1515 !important
}
body.teste-branco #cat-exhausts .ex-notice b{color:#6E0F0F !important}
/* a aba activa estava escrita a preto sobre a pastilha preta */
body.teste-branco #cat-exhausts .ex-anchor.active{color:var(--yellow,#F2C230) !important}
body.teste-branco #cat-exhausts a.xlink{color:#8A6C12 !important}
body.teste-branco #cat-exhausts a.xlink:hover{color:#6E5309 !important}
/* o aviso legal do fundo da pagina estava a rosa-claro sobre rosa-claro */
body.teste-branco #cat-exhausts .ex-legal{
  background:rgba(210,31,31,.06) !important;color:#7A2525 !important;
  border-left-color:#D21F1F !important
}
body.teste-branco #cat-exhausts .ex-legal b,
body.teste-branco #cat-exhausts .ex-legal strong{color:#5E1414 !important}

/* ===== BLOCO 92 - Escapes: a assinatura do topo e o aviso caduco ===== */
#cat-exhausts .section-body > .sec-count.ex-claim{
  font-family:'Oswald',sans-serif !important;
  font-size:clamp(13px,1.6vw,21px) !important;
  font-weight:300 !important;font-style:normal !important;
  letter-spacing:.38em !important;text-transform:uppercase !important;
  color:#2B313B !important;text-align:center !important;
  line-height:1.5 !important;margin:26px auto 6px !important;
  padding:0 20px !important;max-width:900px !important;
  background:transparent !important;border:0 !important;text-shadow:none !important
}
#cat-exhausts .section-body > .sec-count.ex-claim::after{
  content:'';display:block;width:58px;height:2px;margin:18px auto 0;
  background:linear-gradient(90deg,rgba(242,194,48,0),var(--yellow),rgba(242,194,48,0))
}
#cat-exhausts .ex-notice.ex-notice-fora{display:none !important}

/* ============================================================
   BLOCO 93 - Escapes: as marcas no desenho M6c
   Quadro escuro com o texto a esquerda, um quadro por marca a
   direita com o logo ao lado. O que estava antes (titulo
   "Available brands", a linha do swipe e a fila de cartoes)
   fica escondido, nao apagado.
   ============================================================ */
#cat-exhausts .exm-fora{display:none !important}
#cat-exhausts .exm{max-width:1160px;margin:clamp(30px,4vw,54px) auto 0;padding:0 4px}
#cat-exhausts .exm-grade{
  display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(16px,2vw,28px);align-items:stretch}
#cat-exhausts .exm-quadro,
#cat-exhausts .exm-mk{
  background:#0C1016;border:1px solid rgba(255,255,255,.10);border-radius:16px;
  padding:clamp(22px,2.6vw,34px);color:#EDEFF3}
#cat-exhausts .exm-txt{display:flex;flex-direction:column;justify-content:center}
#cat-exhausts .exm-txt em{font-style:normal;color:var(--yellow);font-size:10.5px;
  letter-spacing:.26em;text-transform:uppercase}
#cat-exhausts .exm-txt h3{font-family:'Racing Sans One',cursive;color:#fff;
  font-size:clamp(23px,2.8vw,36px);line-height:1.07;margin:14px 0 16px}
/* 17/10/2026: o Braga achou estas linhas apagadas contra o quadro.
   Subiram de #9AA2AE/#6F7784 para tons que se leem a serio. */
#cat-exhausts .exm-txt p{color:#CBD2DC;font-weight:300;font-size:15.5px;line-height:1.75;
  margin:0 0 12px;max-width:40ch}
#cat-exhausts .exm-txt .exm-nota{color:#9BA4B0;font-size:13.5px;line-height:1.6;max-width:38ch;margin:0}
#cat-exhausts .exm-marcas{display:grid;gap:clamp(14px,1.6vw,20px);align-content:start}
#cat-exhausts .exm-mk{
  display:grid;grid-template-columns:auto 1fr;gap:clamp(20px,2.4vw,34px);
  align-items:center;cursor:pointer;transition:border-color .18s, box-shadow .18s}
#cat-exhausts .exm-mk:hover{border-color:var(--yellow);box-shadow:0 26px 60px -40px rgba(242,194,48,.5)}
#cat-exhausts .exm-lg{width:auto;max-width:100%;display:block;flex:0 0 auto}
#cat-exhausts .exm-nome{font-family:'Racing Sans One',cursive;font-size:30px;color:#fff;display:block}
#cat-exhausts .exm-lado{min-width:0}
#cat-exhausts .exm-tag{display:block;color:var(--yellow);font-size:10px;
  letter-spacing:.26em;text-transform:uppercase;margin-bottom:8px}
#cat-exhausts .exm-sub{display:block;color:#C8CFD9;font-size:14px;font-weight:300;
  line-height:1.55;margin:0 0 18px}
/* o botao estava so contornado e nao chamava. Fica cheio de ouro:
   preto sobre ouro da 12:1 de contraste, e e a cor da casa. */
#cat-exhausts .exm-bt{display:inline-block;border:1px solid var(--yellow);
  background:var(--yellow);color:#15120A;font-weight:600;
  padding:12px 26px;font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;
  border-radius:3px;transition:filter .16s, transform .16s, box-shadow .16s;
  box-shadow:0 10px 26px -14px rgba(242,194,48,.65)}
#cat-exhausts .exm-mk:hover .exm-bt{filter:brightness(1.07);transform:translateY(-1px);
  box-shadow:0 14px 32px -14px rgba(242,194,48,.85)}
@media(max-width:900px){
  #cat-exhausts .exm-grade{grid-template-columns:1fr}
}
@media(max-width:620px){
  #cat-exhausts .exm-mk{grid-template-columns:1fr;gap:16px}
  #cat-exhausts .exm-lg{margin:0 auto}
  #cat-exhausts .exm-lado{text-align:center}
}
/* 17/10/2026: o Braga mandou tirar a frase "Know your exhaust, the
   essentials" - os proprios separadores ja dizem o que ali esta.
   Escondida, nao apagada. */
#cat-exhausts .ex-learn-h{display:none !important}

/* ============================================================
   BLOCO 94 (CSS) - Escapes: quatro cartoes escuros + painel
   17/10/2026
   O Braga: "em todos os quadros deixaria uma borda dourada um
   pouco grossa, para o design ficar completo". Os quadros
   grandes levam 2px de ouro; os cartoes pequenos dentro do
   painel levam 1px mais discreto - se todos levassem 2px, a
   pagina virava uma grelha de caixas douradas e perdia-se a
   hierarquia. O escolhido acende a ouro cheio.
   ============================================================ */
#cat-exhausts .exa-fora{display:none !important}
#cat-exhausts .exa{max-width:1160px;margin:clamp(30px,4vw,56px) auto 0;padding:0 4px}
#cat-exhausts .exa-grade{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
#cat-exhausts .exa-c{
  position:relative;background:#0C1016;border:2px solid rgba(242,194,48,.55);
  border-radius:14px;padding:24px 22px 20px;min-height:176px;color:#EDEFF3;cursor:pointer;
  display:flex;flex-direction:column;text-align:left;font-family:'Oswald',sans-serif;
  transition:border-color .18s, transform .18s, box-shadow .18s}
#cat-exhausts .exa-c:hover{border-color:var(--yellow);transform:translateY(-2px)}
#cat-exhausts .exa-n{font-family:'Racing Sans One',cursive;font-size:19px;color:#5A616C;line-height:1}
#cat-exhausts .exa-c b{display:block;font-size:21px;font-weight:400;margin:12px 0 8px;color:#fff}
#cat-exhausts .exa-c p{margin:0;color:#A9B1BC;font-weight:300;font-size:13.5px;line-height:1.6}
#cat-exhausts .exa-m{margin-top:auto;padding-top:16px;color:#8D95A1;font-size:11px;
  letter-spacing:.2em;text-transform:uppercase;display:flex;align-items:center;gap:8px}
#cat-exhausts .exa-m i{font-style:normal;transition:transform .2s}
#cat-exhausts .exa-c.on{border-color:var(--yellow);
  box-shadow:0 0 0 1px var(--yellow), 0 24px 54px -40px rgba(242,194,48,.8)}
#cat-exhausts .exa-c.on .exa-n{color:#8A6C12}
#cat-exhausts .exa-c.on b{color:var(--yellow)}
#cat-exhausts .exa-c.on .exa-m{color:var(--yellow)}
#cat-exhausts .exa-c.on .exa-m i{transform:rotate(90deg)}
#cat-exhausts .exa-c.on::after{content:'';position:absolute;left:50%;bottom:-16px;
  transform:translateX(-50%) rotate(45deg);width:16px;height:16px;background:#0C1016;
  border-right:2px solid var(--yellow);border-bottom:2px solid var(--yellow);z-index:2}

#cat-exhausts .exa-painel{
  max-width:1160px;margin:14px auto 0;padding:clamp(26px,3.2vw,40px);
  background:#0C1016;border:2px solid var(--yellow);border-radius:16px;color:#EDEFF3}
/* o conteudo dos separadores foi escrito para fundo branco */
#cat-exhausts .exa-painel .ex-sub{color:#A9B1BC !important;text-align:left;margin:0 0 18px}
#cat-exhausts .exa-painel .cat-intro,
#cat-exhausts .exa-painel .cat-intro p,
#cat-exhausts .exa-painel p{color:#C8CFD9 !important}
#cat-exhausts .exa-painel b,
#cat-exhausts .exa-painel strong{color:#ffffff !important}
#cat-exhausts .exa-painel a.xlink{color:var(--yellow) !important}
#cat-exhausts .exa-painel .ex-card{
  background:rgba(255,255,255,.03) !important;
  border:1px solid rgba(242,194,48,.34) !important;color:#EDEFF3 !important}
#cat-exhausts .exa-painel .ex-card p,
#cat-exhausts .exa-painel .ex-card div{color:#A9B1BC !important}
#cat-exhausts .exa-painel .ex-card b{color:#ffffff !important}
#cat-exhausts .exa-painel .ex-flag{color:var(--yellow) !important}
#cat-exhausts .exa-painel .ex-banner{border-color:rgba(242,194,48,.34) !important}

/* os quadros das marcas passam a ter a mesma borda */
#cat-exhausts .exm-quadro,
#cat-exhausts .exm-mk{border:2px solid rgba(242,194,48,.55) !important}
#cat-exhausts .exm-mk:hover{border-color:var(--yellow) !important}

@media(max-width:980px){
  #cat-exhausts .exa-grade{grid-template-columns:1fr 1fr}
}
@media(max-width:620px){
  #cat-exhausts .exa-grade{grid-template-columns:1fr}
  #cat-exhausts .exa-c{min-height:0}
  #cat-exhausts .exa-c.on::after{display:none}
}
/* o separador "Configure & request": dois quadros com o mesmo tratamento */
#cat-exhausts .exa-painel .exreq-brand{
  background:rgba(255,255,255,.03) !important;
  border:1px solid rgba(242,194,48,.34) !important;border-radius:12px !important;
  padding:22px 20px !important}
#cat-exhausts .exa-painel .exreq-brand img{
  background:transparent !important;border:0 !important;padding:0 !important;
  max-height:44px !important;width:auto !important;margin:0 auto 14px !important;
  object-fit:contain !important}
#cat-exhausts .exa-painel .exreq-brand b{color:#fff !important;font-size:18px !important}
#cat-exhausts .exa-painel .exreq-brand small{color:#A9B1BC !important;font-size:13px !important}
#cat-exhausts .exa-painel .exreq-brand.on,
#cat-exhausts .exa-painel .exreq-brand:hover{border-color:var(--yellow) !important}

/* ===== BLOCO 95 - escapes, parte de baixo (desenho B3, duas colunas) ===== */
#cat-exhausts .exf-fora{display:none !important}

#cat-exhausts .exf{max-width:1160px;margin:clamp(26px,3.2vw,44px) auto 0;padding:0}
#cat-exhausts .exf-grade{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(16px,2vw,26px);align-items:stretch}

#cat-exhausts .exf-q{background:#0C1016;border:2px solid rgba(242,194,48,.55);border-radius:18px;
  padding:clamp(24px,3vw,38px);color:#EDEFF3;font-family:'Oswald',sans-serif}
#cat-exhausts .exf-esq{display:flex;flex-direction:column;justify-content:center}

#cat-exhausts .exf-esq h3{font-family:'Racing Sans One',cursive;font-size:clamp(21px,2.6vw,32px);
  line-height:1.12;margin:0 0 14px !important;color:#fff !important;background:none !important;
  border:0 !important;padding:0 !important;text-align:left !important;letter-spacing:0}
#cat-exhausts .exf-esq .lead{color:#C8CFD9 !important;font-weight:300;font-size:15px;line-height:1.8;
  margin:0 0 22px !important;text-align:left !important;max-width:none}

#cat-exhausts .exf-bt{display:inline-block;align-self:flex-start;background:var(--yellow);color:#15120A;
  text-decoration:none;font-weight:600;padding:14px 32px;font-size:12px;letter-spacing:.18em;
  text-transform:uppercase;border-radius:3px;cursor:pointer;
  box-shadow:0 10px 26px -14px rgba(242,194,48,.65);transition:transform .15s ease,box-shadow .15s ease}
#cat-exhausts .exf-bt:hover{transform:translateY(-1px);box-shadow:0 14px 30px -14px rgba(242,194,48,.85);color:#15120A}

#cat-exhausts .exf-p{display:grid;grid-template-columns:30px minmax(0,1fr);gap:16px;align-items:start;
  padding:16px 0;border-top:1px solid rgba(255,255,255,.12)}
#cat-exhausts .exf-p:first-child{border-top:0;padding-top:0}
#cat-exhausts .exf-p:last-child{padding-bottom:0}
#cat-exhausts .exf-p > i{font-style:normal;display:grid;place-items:center;width:30px;height:30px;
  border-radius:50%;background:var(--yellow);color:#15120A;font-weight:600;font-size:14px;line-height:1}
html body #cat-exhausts .exf .exf-p .ex-step{background:none !important;background-color:transparent !important;
  border:0 !important;padding:0 !important;margin:0 !important;box-shadow:none !important;
  border-radius:0 !important;color:#A9B1BC !important;font-weight:300;
  font-size:13.5px !important;line-height:1.55;text-align:left !important;display:block !important}
html body #cat-exhausts .exf .exf-p .ex-step::before{display:none !important;content:none !important}
html body #cat-exhausts .exf .exf-p .ex-step b{display:block;font-size:17px;font-weight:400;
  color:#FFFFFF !important;margin-bottom:4px;letter-spacing:.01em}
html body #cat-exhausts .exf .exf-p .ex-step br{display:none}

html body #cat-exhausts .ex-legal.exf-legal{max-width:1160px;margin:16px auto 0 !important;
  border:0 !important;border-left:3px solid var(--yellow) !important;border-radius:0 !important;
  background:none !important;background-color:transparent !important;padding:2px 0 2px 16px !important;
  color:#6E7681 !important;font-size:12.5px !important;font-weight:300;line-height:1.6;text-align:left !important}
html body #cat-exhausts .ex-legal.exf-legal b,
html body #cat-exhausts .ex-legal.exf-legal strong{color:#2B3038 !important;font-weight:500}
html body #cat-exhausts .ex-legal.exf-legal a.xlink{color:#8A6C12 !important;text-decoration:underline}
html body:not(.teste-branco) #cat-exhausts .ex-legal.exf-legal{color:#8D95A1 !important}
html body:not(.teste-branco) #cat-exhausts .ex-legal.exf-legal b,
html body:not(.teste-branco) #cat-exhausts .ex-legal.exf-legal strong{color:#C8CFD9 !important}
html body:not(.teste-branco) #cat-exhausts .ex-legal.exf-legal a.xlink{color:var(--yellow) !important}

@media(max-width:900px){
  #cat-exhausts .exf-grade{grid-template-columns:minmax(0,1fr)}
  #cat-exhausts .exf-bt{align-self:stretch;text-align:center}
}

/* ===== BLOCO 96 - paginas de marca: a mesma capa de video e a faixa de
   carbono do titulo que ja estao no catalogo, nos escapes e nas outras.
   O Braga (17/10/2026). ===== */
section.brand-page.tem-capa-video .section-body{padding-top:0 !important}

/* a .section-band das paginas de marca era absoluta - nao ocupava espaco e o
   titulo subia-lhe para cima. Entra no fluxo, de ponta a ponta do ecra. */
section.brand-page.tem-capa-video > .section-band.capa-band{
  position:relative !important;display:block !important;
  aspect-ratio:1920/400;height:auto !important;
  overflow:hidden;line-height:0;margin:0;
  width:100vw !important;max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important;margin-right:calc(50% - 50vw) !important}
section.brand-page.tem-capa-video > .section-band.capa-band .capa-vid{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
section.brand-page.tem-capa-video > .section-band.capa-band::after{display:none !important}

/* o titulo e a sobrancelha ficam POR CIMA da faixa de carbono, a branco */
section.brand-page.tem-capa-video .section-body > h2{
  position:relative;z-index:2;color:#ffffff !important;background:transparent !important;
  border-bottom-color:transparent !important;text-align:center;
  text-shadow:0 2px 18px rgba(0,0,0,.85)}
section.brand-page.tem-capa-video .section-body > .eyebrow{
  position:relative;z-index:2;color:var(--yellow,#F2C230) !important;background:transparent !important;
  border-top-color:transparent !important;text-align:center;
  text-shadow:0 2px 12px rgba(0,0,0,.85)}
section.brand-page.tem-capa-video > .tit-video{z-index:0}

/* a frase por baixo do titulo saia fora do ecra */
html body section.brand-page .section-body > h2 + .sec-count.bp-claim{
  font-size:clamp(13px,1.7vw,19px) !important;white-space:normal !important;
  letter-spacing:.1em;text-transform:uppercase;color:#4A505B !important;
  max-width:900px;margin:10px auto 0;text-align:center;line-height:1.35}
html body section.brand-page .section-body > h2 + .sec-count.bp-claim a.xlink{color:#8A6C12 !important}
html body section.brand-page .section-body > h2 + .sec-count.bp-claim em,
html body section.brand-page .section-body > h2 + .sec-count.bp-claim i{font-style:normal;color:#8A6C12}

/* ===== os textos estavam quase brancos sobre o fundo branco ===== */
body.teste-branco #cat-akrapovic .ak-txt h3{color:#14171C !important;text-shadow:none !important}
body.teste-branco #cat-akrapovic .ak-txt p{color:#3C424D !important}
body.teste-branco #cat-akrapovic .ak-txt p strong{color:#14171C !important}
body.teste-branco #cat-akrapovic .ak-eyebrow{color:#8A6C12 !important}
body.teste-branco #cat-akrapovic .ak-soon h4{color:#14171C !important;text-shadow:none !important}
body.teste-branco #cat-akrapovic .ak-soon p{color:#3C424D !important}
body.teste-branco #cat-akrapovic .ak-soon{background:#FFFDF6 !important;
  border:2px solid rgba(242,194,48,.55) !important}
body.teste-branco #cat-akrapovic .ak-logo{border:1px solid rgba(12,16,24,.14) !important;
  box-shadow:0 14px 34px -22px rgba(12,16,24,.5) !important}
body.teste-branco #cat-akrapovic .ak-hero{border:2px solid rgba(242,194,48,.55) !important;
  box-shadow:0 26px 60px -36px rgba(12,16,24,.55) !important}
/* (substituido mais abaixo: botao preto com letra branca) */

/* ===== BLOCO 98 - Akrapovic: corpo da pagina (A4 + assinatura do A6) ===== */
#cat-akrapovic .akv-fora{display:none !important}
#cat-akrapovic .akv{max-width:1180px;margin:22px auto 0}

/* --- a foto com a assinatura ao centro --- */
#cat-akrapovic .akv-foto{position:relative;border:2px solid rgba(242,194,48,.55);border-radius:16px;
  overflow:hidden;box-shadow:0 26px 60px -36px rgba(12,16,24,.55)}
#cat-akrapovic .akv-foto .ak-hero{margin:0 !important;border:0 !important;border-radius:0 !important;
  box-shadow:none !important;max-width:none !important}
#cat-akrapovic .akv-foto .ak-hero img{width:100%;height:auto;display:block}
#cat-akrapovic .akv-foto::after{content:'';position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(7,9,12,.15) 0%,rgba(7,9,12,.25) 42%,rgba(7,9,12,.9) 100%)}
#cat-akrapovic .akv-sobre{position:absolute;left:0;right:0;bottom:0;z-index:2;text-align:center;
  padding:clamp(22px,4vw,54px) clamp(18px,3vw,40px)}
#cat-akrapovic .akv-olho{color:var(--yellow) !important;font-family:'Oswald',sans-serif;font-weight:600;
  font-size:clamp(11px,1.5vw,15px) !important;letter-spacing:.34em;text-transform:uppercase;
  margin:0 0 10px !important;text-shadow:0 2px 14px rgba(0,0,0,.9);text-align:center !important}
#cat-akrapovic .akv-tit{font-family:'Racing Sans One',sans-serif;color:#fff !important;
  font-size:clamp(30px,5.4vw,66px) !important;line-height:1.05;margin:0 !important;letter-spacing:1px;
  text-shadow:0 4px 26px rgba(0,0,0,.92);text-align:center !important}

/* --- duas colunas: lado fixo + corpo --- */
#cat-akrapovic .akv-grade{display:grid;grid-template-columns:330px minmax(0,1fr);
  gap:clamp(18px,2.4vw,30px);align-items:start;margin-top:clamp(20px,2.6vw,32px)}

#cat-akrapovic .akv-lado{position:sticky;top:96px;background:#0C1016;
  border:2px solid rgba(242,194,48,.55);border-radius:18px;padding:26px 24px;text-align:center}
#cat-akrapovic .akv-lado .akv-mk{width:100% !important;margin:0 0 18px !important;background:#fff !important;
  border-radius:12px !important;padding:18px !important;box-shadow:none !important;border:0 !important;
  display:flex;align-items:center;justify-content:center}
#cat-akrapovic .akv-lado .akv-mk img{width:100%;height:auto}
html body #cat-akrapovic .akv-lado .akv-pedido{margin:0 !important;padding:0 !important;
  background:none !important;background-color:transparent !important;border:0 !important;
  border-top:1px solid rgba(255,255,255,.14) !important;border-radius:0 !important;
  padding-top:18px !important;text-align:center !important;max-width:none !important}
html body #cat-akrapovic .akv-lado .akv-ph{font-family:'Racing Sans One',sans-serif;
  font-size:19px !important;color:#fff !important;margin:0 0 8px !important;text-shadow:none !important}
html body #cat-akrapovic .akv-lado .akv-pedido p{color:#A9B1BC !important;font-weight:300;
  font-size:13.5px !important;line-height:1.6;margin:0 0 16px !important;max-width:none !important}
html body #cat-akrapovic .akv-lado .exreq-cta{width:100%;justify-content:center;
  background:var(--yellow) !important;color:#15120A !important;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;border:0 !important;border-radius:3px;
  padding:14px 18px !important;font-size:12px !important;cursor:pointer;
  box-shadow:0 10px 26px -14px rgba(242,194,48,.65)}

#cat-akrapovic .akv-corpo{padding-top:4px}
html body #cat-akrapovic .akv-corpo .akv-p{color:#3C424D !important;font-weight:300;
  font-size:15.5px !important;line-height:1.85;margin:0 0 14px !important;text-align:left !important}
html body #cat-akrapovic .akv-corpo .akv-p strong,
html body #cat-akrapovic .akv-corpo .akv-p b{color:#14171C !important;font-weight:500}

#cat-akrapovic .akv-lista{margin-top:24px;border-top:1px solid rgba(12,16,24,.14)}
#cat-akrapovic .akv-lista > div{display:grid;grid-template-columns:160px minmax(0,1fr);gap:16px;
  padding:14px 0;border-bottom:1px solid rgba(12,16,24,.1)}
#cat-akrapovic .akv-lista b{font-family:'Oswald',sans-serif;font-size:11.5px;letter-spacing:.18em;
  text-transform:uppercase;color:#8A6C12;font-weight:600}
#cat-akrapovic .akv-lista span{color:#3C424D;font-weight:300;font-size:14.5px}

/* fundo escuro do site, se ele voltar a trocar o tema */
body:not(.teste-branco) #cat-akrapovic .akv-corpo .akv-p{color:#C8CFD9 !important}
body:not(.teste-branco) #cat-akrapovic .akv-corpo .akv-p strong,
body:not(.teste-branco) #cat-akrapovic .akv-corpo .akv-p b{color:#fff !important}
body:not(.teste-branco) #cat-akrapovic .akv-lista{border-top-color:rgba(255,255,255,.14)}
body:not(.teste-branco) #cat-akrapovic .akv-lista > div{border-bottom-color:rgba(255,255,255,.1)}
body:not(.teste-branco) #cat-akrapovic .akv-lista b{color:var(--yellow)}
body:not(.teste-branco) #cat-akrapovic .akv-lista span{color:#C8CFD9}

@media(max-width:900px){
  #cat-akrapovic .akv-grade{grid-template-columns:minmax(0,1fr)}
  #cat-akrapovic .akv-lado{position:static}
  #cat-akrapovic .akv-lado .akv-mk{width:220px !important;margin:0 auto 18px !important}
  #cat-akrapovic .akv-lista > div{grid-template-columns:minmax(0,1fr);gap:4px}
}

/* ===== 17/10/2026, O Braga: contraste na pagina da Akrapovic =====
   Os dois paragrafos e a ficha ficam quase pretos; o texto do pedido,
   que esta dentro do quadro escuro, fica mais branco; e o botao de
   voltar passa a preto com letra branca - estava apagado. */
html body #cat-akrapovic .akv-corpo .akv-p{color:#14171C !important}
html body #cat-akrapovic .akv-corpo .akv-p strong,
html body #cat-akrapovic .akv-corpo .akv-p b{color:#000 !important;font-weight:600}
html body #cat-akrapovic .akv-lista span{color:#14171C !important;font-weight:400}

html body #cat-akrapovic .akv-lado .akv-pedido p{color:#EDF1F6 !important;font-weight:300}
html body #cat-akrapovic .akv-lado .akv-ph{color:#FFFFFF !important}

html body.teste-branco #cat-akrapovic a.brand-cta,
html body #cat-akrapovic a.brand-cta{
  background:#0C1016 !important;color:#FFFFFF !important;
  border:2px solid rgba(242,194,48,.55) !important;border-radius:4px !important;
  padding:14px 30px !important;font-family:'Oswald',sans-serif;font-weight:500;
  font-size:12.5px !important;letter-spacing:.16em;text-transform:uppercase;
  text-decoration:none !important;display:inline-block;
  box-shadow:0 14px 34px -24px rgba(12,16,24,.75)}
html body.teste-branco #cat-akrapovic a.brand-cta:hover,
html body #cat-akrapovic a.brand-cta:hover{
  background:#14191F !important;border-color:var(--yellow) !important;color:#FFFFFF !important}

/* ===== BLOCO 99 - Formula Z: topo da pagina (desenho F1) ===== */
#cat-formulaz .fzv-fora{display:none !important}
#cat-formulaz .fzv{max-width:1180px;margin:22px auto 0}

#cat-formulaz .fzv-v{position:relative;border:2px solid rgba(242,194,48,.55);border-radius:16px;
  overflow:hidden;box-shadow:0 26px 60px -36px rgba(12,16,24,.55)}
#cat-formulaz .fzv-v .fz-banner{margin:0 !important;border:0 !important;border-radius:0 !important;
  max-width:none !important;width:100%;line-height:0}
#cat-formulaz .fzv-v .fz-banner video{width:100%;height:auto;aspect-ratio:1600/334;
  object-fit:cover;display:block}
#cat-formulaz .fzv-v::after{content:'';position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(7,9,12,0) 0%,rgba(7,9,12,.08) 45%,rgba(7,9,12,.82) 100%)}
#cat-formulaz .fzv-sobre{position:absolute;left:0;right:0;bottom:0;z-index:2;text-align:center;
  padding:clamp(12px,2vw,26px) clamp(16px,3vw,36px)}
#cat-formulaz .fzv-olho{color:var(--yellow) !important;font-family:'Oswald',sans-serif;font-weight:600;
  font-size:clamp(9.5px,1.25vw,14px) !important;letter-spacing:.3em;text-transform:uppercase;
  margin:0 0 6px !important;text-shadow:0 2px 14px rgba(0,0,0,.9);text-align:center !important}
#cat-formulaz .fzv-tit{font-family:'Racing Sans One',sans-serif;color:#fff !important;
  font-size:clamp(24px,4.4vw,58px) !important;line-height:1;margin:0 !important;letter-spacing:1px;
  text-shadow:0 4px 26px rgba(0,0,0,.94);text-align:center !important}

#cat-formulaz .fzv-g{display:grid;grid-template-columns:330px minmax(0,1fr);
  gap:clamp(18px,2.4vw,30px);align-items:start;margin-top:clamp(20px,2.6vw,32px)}

#cat-formulaz .fzv-lado{background:#0C1016;border:2px solid rgba(242,194,48,.55);border-radius:18px;
  padding:24px;text-align:center}
#cat-formulaz .fzv-lado .fzv-mk{width:100% !important;margin:0 0 16px !important;padding:0 !important;
  background:none !important;border:0 !important;border-radius:12px !important;overflow:hidden;
  box-shadow:none !important;display:block}
#cat-formulaz .fzv-lado .fzv-mk img{width:100%;height:auto;display:block;border-radius:12px}
#cat-formulaz .fzv-pill{display:inline-block;background:var(--yellow);color:#15120A;border-radius:999px;
  padding:6px 15px;font-family:'Oswald',sans-serif;font-size:10.5px;letter-spacing:.22em;
  text-transform:uppercase;font-weight:600}

html body #cat-formulaz .fzv-corpo .fzv-p{color:#14171C !important;font-weight:300;
  font-size:16px !important;line-height:1.85;margin:0 0 14px !important;text-align:left !important}
html body #cat-formulaz .fzv-corpo .fzv-p b,
html body #cat-formulaz .fzv-corpo .fzv-p strong{color:#000 !important;font-weight:600}

#cat-formulaz .fzv-lista{margin-top:22px;border-top:1px solid rgba(12,16,24,.14)}
#cat-formulaz .fzv-lista > div{display:grid;grid-template-columns:170px minmax(0,1fr);gap:16px;
  padding:13px 0;border-bottom:1px solid rgba(12,16,24,.1)}
#cat-formulaz .fzv-lista b{font-family:'Oswald',sans-serif;font-size:11.5px;letter-spacing:.18em;
  text-transform:uppercase;color:#8A6C12;font-weight:600}
#cat-formulaz .fzv-lista span{color:#14171C;font-weight:400;font-size:14.5px}

body:not(.teste-branco) #cat-formulaz .fzv-corpo .fzv-p{color:#C8CFD9 !important}
body:not(.teste-branco) #cat-formulaz .fzv-lista{border-top-color:rgba(255,255,255,.14)}
body:not(.teste-branco) #cat-formulaz .fzv-lista > div{border-bottom-color:rgba(255,255,255,.1)}
body:not(.teste-branco) #cat-formulaz .fzv-lista b{color:var(--yellow)}
body:not(.teste-branco) #cat-formulaz .fzv-lista span{color:#C8CFD9}

@media(max-width:900px){
  #cat-formulaz .fzv-g{grid-template-columns:minmax(0,1fr)}
  #cat-formulaz .fzv-lado .fzv-mk{width:230px !important;margin:0 auto 16px !important}
  #cat-formulaz .fzv-lista > div{grid-template-columns:minmax(0,1fr);gap:4px}
}

/* ===== BLOCO 100 - voltar aos escapes: pastilha no topo + botao no fim ===== */
#blp-volta-escapes{position:fixed;z-index:10086;display:none;align-items:center;gap:7px;
  background:#0C1016;color:#FFFFFF;border:2px solid rgba(242,194,48,.55);border-radius:999px;
  padding:8px 18px;font-family:'Oswald',sans-serif;font-weight:500;font-size:12.5px;
  letter-spacing:.14em;text-transform:uppercase;cursor:pointer;line-height:1;
  box-shadow:0 12px 30px -18px rgba(0,0,0,.9)}
#blp-volta-escapes:hover{border-color:var(--yellow);background:#14191F}
#blp-volta-escapes .bvt-seta{color:var(--yellow);font-size:15px;line-height:1}
@media(max-width:720px){#blp-volta-escapes{padding:7px 13px;font-size:10.5px;letter-spacing:.1em}
  #blp-volta-escapes .bvt-tx{display:none}}

.blp-volta-fim{max-width:1180px;margin:clamp(26px,3.4vw,44px) auto 10px !important;
  text-align:center;padding:0 26px}
html body .blp-volta-fim > button{
  background:#0C1016 !important;color:#FFFFFF !important;
  border:2px solid rgba(242,194,48,.55) !important;border-radius:4px !important;
  padding:14px 32px !important;font-family:'Oswald',sans-serif !important;font-weight:500;
  font-size:12.5px !important;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;
  box-shadow:0 14px 34px -24px rgba(12,16,24,.75)}
html body .blp-volta-fim > button:hover{background:#14191F !important;
  border-color:var(--yellow) !important;color:#FFFFFF !important}

/* ===== BLOCO 101 - Formula Z: "What is the Z-Pipe?" no desenho Z3 ===== */
#cat-formulaz .zpb-fora{display:none !important}
#cat-formulaz .zpb-wrap{max-width:1180px;margin:clamp(20px,2.6vw,32px) auto 0;display:grid;gap:18px}

#cat-formulaz .zpb{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,2.4vw,32px);
  align-items:center;background:#0C1016;border:2px solid rgba(242,194,48,.55);
  border-radius:18px;padding:clamp(20px,2.4vw,30px);color:#EDEFF3}
#cat-formulaz .zpb:nth-child(even) .zpb-txt{order:-1}

#cat-formulaz .zpb-fig{background:rgba(255,255,255,.03);border:1px solid rgba(242,194,48,.3);
  border-radius:12px;padding:14px}
html body #cat-formulaz .zpb-fig figure{margin:0 !important;padding:0 !important;border:0 !important;
  background:none !important;box-shadow:none !important}
html body #cat-formulaz .zpb-fig figure img{width:100%;height:auto;display:block;border-radius:8px}
html body #cat-formulaz .zpb-fig figure figcaption{display:none !important}

html body #cat-formulaz .zpb-txt .zpb-p{background:none !important;background-color:transparent !important;
  border:0 !important;border-top:1px solid rgba(255,255,255,.12) !important;border-radius:0 !important;
  box-shadow:none !important;padding:14px 0 !important;margin:0 !important;min-height:0 !important}
html body #cat-formulaz .zpb-txt .zpb-p:first-child{border-top:0 !important;padding-top:0 !important}
html body #cat-formulaz .zpb-txt .zpb-p h4{font-family:'Oswald',sans-serif;font-size:19px !important;
  font-weight:400 !important;color:#FFFFFF !important;margin:0 0 6px !important;letter-spacing:.01em}
html body #cat-formulaz .zpb-txt .zpb-p p{color:#C8CFD9 !important;font-weight:300;
  font-size:14.5px !important;line-height:1.65;margin:0 !important}
html body #cat-formulaz .zpb-txt .zpb-p p b,
html body #cat-formulaz .zpb-txt .zpb-p p strong{color:#FFFFFF !important;font-weight:500}
html body #cat-formulaz .zpb-txt .zpb-p a.xlink{color:var(--yellow) !important}

/* a frase por baixo do titulo da seccao */
html body #cat-formulaz .ex-sub{color:#3C424D !important}
html body:not(.teste-branco) #cat-formulaz .ex-sub{color:#A9B1BC !important}

/* a nota de prova: era rosa-claro sobre rosa-claro */
html body #cat-formulaz .ak-soon.zpb-prova{max-width:1180px;margin:clamp(22px,2.8vw,34px) auto 0 !important;
  background:#0C1016 !important;background-color:#0C1016 !important;
  border:2px solid rgba(242,194,48,.55) !important;border-radius:14px !important;
  padding:20px 26px !important;text-align:center !important}
html body #cat-formulaz .ak-soon.zpb-prova .zpb-sel{display:inline-block;background:var(--yellow);
  color:#15120A;border-radius:999px;padding:4px 13px;font-family:'Oswald',sans-serif;font-size:10px;
  letter-spacing:.2em;text-transform:uppercase;font-weight:600;margin-bottom:10px}
html body #cat-formulaz .ak-soon.zpb-prova p{color:#DDE3EB !important;font-weight:300;
  font-size:14.5px !important;line-height:1.65;margin:0 !important;max-width:none !important;
  text-align:center !important}
html body #cat-formulaz .ak-soon.zpb-prova p b,
html body #cat-formulaz .ak-soon.zpb-prova p strong{color:#FFFFFF !important;font-weight:500}

@media(max-width:900px){
  #cat-formulaz .zpb{grid-template-columns:minmax(0,1fr)}
  #cat-formulaz .zpb:nth-child(even) .zpb-txt{order:0}
}

/* ===== BLOCO 102 - Formula Z: "The model range" no desenho R4 ===== */
html body #cat-formulaz .ex-grid.rng{max-width:1180px;margin:clamp(20px,2.6vw,32px) auto 0 !important;
  display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:16px !important}

html body #cat-formulaz .ex-card.rng-c{background:#0C1016 !important;
  border:2px solid rgba(242,194,48,.55) !important;border-radius:16px !important;
  padding:24px !important;display:flex !important;flex-direction:column;color:#EDEFF3}
html body #cat-formulaz .ex-card.rng-c h4{font-family:'Oswald',sans-serif;font-size:20px !important;
  font-weight:500 !important;color:#FFFFFF !important;margin:0 0 10px !important;
  display:flex;align-items:center;gap:10px;flex-wrap:wrap}
html body #cat-formulaz .ex-card.rng-c h4 .tag{background:var(--yellow) !important;color:#15120A !important;
  border:0 !important;border-radius:999px !important;padding:4px 11px !important;
  font-family:'Oswald',sans-serif;font-size:9.5px !important;letter-spacing:.18em;text-transform:uppercase;
  font-weight:600 !important;line-height:1.3}
html body #cat-formulaz .ex-card.rng-c p{margin:0 0 16px !important;color:#C8CFD9 !important;font-weight:300;
  font-size:14.5px !important;line-height:1.65}
html body #cat-formulaz .ex-card.rng-c p b,
html body #cat-formulaz .ex-card.rng-c p strong{color:#FFFFFF !important;font-weight:500}
html body #cat-formulaz .ex-card.rng-c p em,
html body #cat-formulaz .ex-card.rng-c p i{color:#E8D79A !important}

#cat-formulaz .rng-chips{margin-top:auto;display:flex;flex-wrap:wrap;gap:7px;padding-top:14px;
  border-top:1px solid rgba(255,255,255,.12)}
#cat-formulaz .rng-chips span{border:1px solid rgba(242,194,48,.4);color:#E8D79A;border-radius:999px;
  padding:5px 11px;font-family:'Oswald',sans-serif;font-size:11px;font-weight:400;letter-spacing:.06em;
  line-height:1.3;white-space:nowrap}

@media(max-width:980px){html body #cat-formulaz .ex-grid.rng{grid-template-columns:repeat(2,minmax(0,1fr)) !important}}
@media(max-width:620px){html body #cat-formulaz .ex-grid.rng{grid-template-columns:minmax(0,1fr) !important}
  #cat-formulaz .rng-chips span{white-space:normal}}

/* ===== BLOCO 103 - Formula Z: faixa preta dos clipes + configurador ===== */
#cat-formulaz .zpc-banda{position:relative;margin:clamp(20px,2.6vw,32px) 0 0;
  width:100vw;max-width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
  background:#07090C;border-top:3px solid var(--yellow);border-bottom:3px solid var(--yellow);
  padding:clamp(16px,1.8vw,22px) 0;overflow:hidden}
#cat-formulaz .zpc-banda::before,
#cat-formulaz .zpc-banda::after{content:'';position:absolute;top:0;bottom:0;width:clamp(50px,7vw,110px);
  z-index:3;pointer-events:none}
#cat-formulaz .zpc-banda::before{left:0;background:linear-gradient(90deg,#07090C,rgba(7,9,12,0))}
#cat-formulaz .zpc-banda::after{right:0;background:linear-gradient(270deg,#07090C,rgba(7,9,12,0))}

html body #cat-formulaz .zp-carousel.zpc-dentro{max-width:100% !important;width:100% !important;
  margin:0 !important;padding:0 !important;background:none !important;border:0 !important}
html body #cat-formulaz .zpc-dentro .zp-item{border:2px solid rgba(242,194,48,.45) !important;
  border-radius:14px !important;overflow:hidden}

/* o configurador sobrepoe-se ao fundo da faixa */
html body #cat-formulaz .ak-soon.zpc-cta{position:relative;z-index:4;
  max-width:900px;margin:clamp(18px,2.2vw,28px) auto 0 !important;
  background:#0C1016 !important;background-color:#0C1016 !important;
  border:2px solid var(--yellow) !important;border-radius:18px !important;
  padding:clamp(24px,2.8vw,36px) clamp(22px,2.6vw,34px) !important;text-align:center !important;
  box-shadow:0 34px 70px -40px rgba(0,0,0,.9)}
html body #cat-formulaz .zpc-cta .zpc-tit{font-family:'Racing Sans One',sans-serif;
  color:#FFFFFF !important;font-size:clamp(21px,2.4vw,29px) !important;margin:0 0 10px !important;
  text-align:center !important;letter-spacing:.5px;background:none !important;border:0 !important}
html body #cat-formulaz .zpc-cta p{color:#C8CFD9 !important;font-weight:300;font-size:15px !important;
  line-height:1.7;max-width:640px;margin:0 auto 20px !important;text-align:center !important}
html body #cat-formulaz .zpc-cta .zpc-bt{background:var(--yellow) !important;color:#15120A !important;
  border:0 !important;border-radius:4px !important;padding:16px 34px !important;
  font-family:'Oswald',sans-serif !important;font-weight:600 !important;font-size:13px !important;
  letter-spacing:.14em;text-transform:uppercase;cursor:pointer;
  box-shadow:0 12px 30px -16px rgba(242,194,48,.75) !important}
html body #cat-formulaz .zpc-cta .zpc-bt:hover{background:#FFD24A !important;color:#15120A !important}
html body #cat-formulaz .zpc-cta .zpc-bt svg{stroke:#15120A !important}

@media(max-width:620px){
  html body #cat-formulaz .ak-soon.zpc-cta{margin-left:16px !important;margin-right:16px !important}
}

/* ===== BLOCO 104 - Escapes: janela do aviso legal ===== */
.exl-ov .exl-modal{border-color:rgba(242,194,48,.5)}
.exl-ov .exl-badge{background:var(--yellow);color:#15120A;font-size:26px;line-height:1}
.exl-ov .exl-points span{text-align:left}
.exl-ov .exl-points a{color:var(--yellow);text-decoration:underline;cursor:pointer}
.exl-ov .exl-points a:hover{color:#FFD24A}
.exl-ov .exl-btn{background:var(--yellow);color:#15120A;border:0;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;
  box-shadow:0 12px 30px -16px rgba(242,194,48,.75)}
.exl-ov .exl-btn:hover{background:#FFD24A;color:#15120A}

html body #cat-exhausts .ex-legal.exl-escondida{display:none !important}
#exl-rever{display:block;margin:clamp(20px,2.6vw,32px) auto 0;background:#0C1016;color:#FFFFFF;
  border:2px solid rgba(242,194,48,.55);border-radius:999px;padding:10px 22px;
  font-family:'Oswald',sans-serif;font-weight:500;font-size:12px;letter-spacing:.14em;
  text-transform:uppercase;cursor:pointer;line-height:1.2}
#exl-rever:hover{border-color:var(--yellow);background:#14191F}

/* ================= BLOCO 106 — chips de categoria (noticias + videos) ================= */
html body .news-cats,
html body.teste-branco .news-cats{
  display:flex;flex-wrap:wrap;gap:9px;justify-content:center;
  margin:22px auto 0;max-width:900px;padding:0 10px;
}
html body .news-cat,
html body.teste-branco .news-cat{
  background:rgba(255,255,255,.035) !important;
  border:1px solid rgba(242,194,48,.30) !important;
  color:#D8DDE5 !important;
  padding:9px 19px;border-radius:999px;
  font-family:'Oswald',sans-serif;font-size:12.5px;line-height:1;
  letter-spacing:.09em;text-transform:uppercase;font-weight:500;
  cursor:pointer;
  transition:background .16s ease,color .16s ease,border-color .16s ease,box-shadow .16s ease,transform .16s ease;
}
html body .news-cat:hover,
html body.teste-branco .news-cat:hover{
  background:rgba(242,194,48,.12) !important;
  border-color:rgba(242,194,48,.80) !important;
  color:#fff !important;transform:translateY(-1px);
}
html body .news-cat.on,
html body.teste-branco .news-cat.on{
  background:linear-gradient(180deg,#F7D152 0%,#DCA614 100%) !important;
  border-color:#F2C230 !important;
  color:#15120A !important;font-weight:700;
  box-shadow:0 2px 15px rgba(242,194,48,.32),inset 0 1px 0 rgba(255,255,255,.48);
  transform:none;
}
html body .news-cat.on:hover,
html body.teste-branco .news-cat.on:hover{
  background:linear-gradient(180deg,#FFD95E 0%,#E3AC17 100%) !important;
  color:#15120A !important;transform:none;
}
html body .news-cat:focus-visible,
html body.teste-branco .news-cat:focus-visible{
  outline:2px solid #F2C230;outline-offset:2px;
}
@media(max-width:720px){
  html body .news-cats,
  html body.teste-branco .news-cats{gap:7px;margin-top:16px}
  html body .news-cat,
  html body.teste-branco .news-cat{font-size:11px;padding:8px 14px;letter-spacing:.07em}
}

/* ================= BLOCO 107 — corpo do artigo (titulos, listas, links) ================= */
html body .art-body,
html body.teste-branco .art-body{
  color:#1B1F26 !important;font-weight:300;font-size:16px;line-height:1.78;
}
html body .art-body p,
html body.teste-branco .art-body p{margin:0 0 16px;color:#1B1F26}
html body .art-body strong,
html body.teste-branco .art-body strong{color:#0B0E13;font-weight:600}
html body .art-body h2,
html body.teste-branco .art-body h2{
  clear:none;margin:30px 0 13px;padding-bottom:9px;
  font-family:'Oswald',sans-serif;font-weight:500;
  font-size:clamp(17px,2.1vw,22px);letter-spacing:.04em;text-transform:uppercase;
  color:#0B0E13;border-bottom:2px solid rgba(242,194,48,.85);
}
html body .art-body h2:first-child,
html body.teste-branco .art-body h2:first-child{margin-top:6px}
html body .art-body ul,
html body .art-body ol,
html body.teste-branco .art-body ul,
html body.teste-branco .art-body ol{margin:0 0 18px;padding-left:22px}
html body .art-body li,
html body.teste-branco .art-body li{margin:0 0 9px;color:#1B1F26;line-height:1.7}
html body .art-body li::marker,
html body.teste-branco .art-body li::marker{color:#C19A12}
html body .art-body a.art-a,
html body.teste-branco .art-body a.art-a{
  color:#8A6C12;font-weight:400;text-decoration:none;
  border-bottom:1px solid rgba(138,108,18,.42);
  transition:color .15s,border-color .15s,background .15s;
}
html body .art-body a.art-a:hover,
html body.teste-branco .art-body a.art-a:hover{
  color:#0B0E13;border-bottom-color:#F2C230;background:rgba(242,194,48,.16);
}
html body .art-wrap,
html body.teste-branco .art-wrap{max-width:900px}
@media(max-width:720px){
  html body .art-body,
  html body.teste-branco .art-body{font-size:15.5px;line-height:1.75}
  html body .art-wrap img,
  html body.teste-branco .art-wrap img{float:none !important;max-width:100% !important;margin:0 0 18px !important}
}

/* ================= BLOCO 108 — noticias N5: faixa escura + tira com controlos ================= */
html body #news-carousel.nv-faixa,
html body.teste-branco #news-carousel.nv-faixa{
  display:block !important;overflow:visible !important;max-width:none !important;
  width:100vw;margin:clamp(20px,2.6vw,32px) 0 0 calc(50% - 50vw);padding:clamp(24px,3vw,42px) 0;
  background:#0C1016;border-top:2px solid var(--yellow);border-bottom:2px solid var(--yellow);
  scroll-snap-type:none;
}
html body .nv-faixa .nv-in{
  max-width:1180px;margin:0 auto;padding:0 clamp(16px,3vw,26px);
  display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(20px,2.8vw,38px);align-items:center;
}
html body .nv-faixa .nv-capa{
  aspect-ratio:16/10;border-radius:12px;border:1px solid rgba(242,194,48,.45);
  background:#161B22 center/cover no-repeat;cursor:pointer;transition:border-color .18s,transform .18s;
}
html body .nv-faixa .nv-capa:hover{border-color:var(--yellow);transform:translateY(-2px)}
html body .nv-faixa .nv-tx{color:#EDEFF3;text-align:left}
html body .nv-faixa .nv-sel{
  display:inline-block;background:var(--yellow);color:#15120A;border-radius:999px;padding:4px 13px;
  font-family:'Oswald',sans-serif;font-size:10px;letter-spacing:.2em;text-transform:uppercase;font-weight:700;
}
html body .nv-faixa .nv-meta{
  color:var(--yellow);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;margin:13px 0 8px;
}
html body .nv-faixa h4{
  margin:0 0 12px;color:#fff;font-family:'Oswald',sans-serif;font-weight:500;
  font-size:clamp(21px,2.8vw,34px);line-height:1.2;
}
html body .nv-faixa p{
  margin:0 0 20px;color:#C8CFD9;font-weight:300;font-size:15px;line-height:1.65;max-width:52ch;
}
html body .nv-faixa .nv-bt{
  background:linear-gradient(180deg,#F7D152 0%,#DCA614 100%);border:1px solid var(--yellow);
  color:#15120A;border-radius:999px;padding:12px 26px;cursor:pointer;
  font-family:'Oswald',sans-serif;font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;font-weight:700;
  box-shadow:0 2px 15px rgba(242,194,48,.28),inset 0 1px 0 rgba(255,255,255,.45);
}
html body .nv-faixa .nv-bt:hover{background:linear-gradient(180deg,#FFD95E 0%,#E3AC17 100%)}

/* --- tira --- */
html body .news-grid.nv-host,
html body.teste-branco .news-grid.nv-host{
  display:block !important;grid-template-columns:none !important;max-width:none !important;
  width:100vw;margin:clamp(18px,2.4vw,28px) 0 0 calc(50% - 50vw);padding:0 !important;
  overflow:visible !important;
}
html body .nv-caixa{position:relative;overflow:hidden;padding:6px 0 4px}
html body .nv-caixa.nv-laco{
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 54px,#000 calc(100% - 54px),transparent 100%);
          mask-image:linear-gradient(90deg,transparent 0,#000 54px,#000 calc(100% - 54px),transparent 100%);
}
html body .nv-tira{
  overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none;
  cursor:grab;touch-action:pan-y;scroll-behavior:auto;
}
html body .nv-tira::-webkit-scrollbar{display:none}
html body .nv-caixa.nv-pega .nv-tira{cursor:grabbing}
html body .nv-pista{display:flex;gap:18px;width:max-content;padding:4px 0 10px}
html body .nv-caixa.nv-curta .nv-pista{width:auto;justify-content:center;flex-wrap:nowrap;margin:0 auto;padding-left:14px;padding-right:14px}
html body .nv-pista .news-card.nv-c,
html body .nv-pista .news-card,
html body.teste-branco .nv-pista .news-card{
  flex:0 0 300px !important;width:300px !important;margin:0 !important;
  border:1px solid rgba(242,194,48,.45) !important;border-radius:14px;overflow:hidden;
  transition:border-color .18s ease,transform .18s ease,box-shadow .18s ease;
}
html body .nv-pista .news-card:hover,
html body.teste-branco .nv-pista .news-card:hover{
  border-color:var(--yellow) !important;transform:translateY(-3px);
  box-shadow:0 6px 24px rgba(242,194,48,.18);
}
html body .nv-pista .news-card .nc-cover{aspect-ratio:16/10 !important}
html body .nv-pista .news-card *{user-select:none;-webkit-user-drag:none}
/* setas */
html body .nv-seta{
  position:absolute;top:50%;transform:translateY(-50%);z-index:6;
  width:42px;height:42px;border-radius:50%;cursor:pointer;
  background:rgba(12,16,22,.86);border:1px solid var(--yellow);color:var(--yellow);
  font-size:24px;line-height:1;display:flex;align-items:center;justify-content:center;
  transition:background .16s,color .16s,transform .16s;padding:0 0 3px;
}
html body .nv-seta:hover{background:var(--yellow);color:#15120A;transform:translateY(-50%) scale(1.06)}
html body .nv-seta.nv-esq{left:10px}
html body .nv-seta.nv-dir{right:10px}
html body .nv-caixa.nv-curta .nv-seta{display:none}
/* pontos */
html body .nv-pontos{display:flex;gap:7px;justify-content:center;align-items:center;margin:12px 0 2px;min-height:10px}
html body .nv-ponto{
  width:8px;height:8px;border-radius:50%;padding:0;cursor:pointer;
  background:rgba(12,16,22,.22);border:1px solid rgba(242,194,48,.55);transition:.18s;
}
html body .nv-ponto:hover{background:rgba(242,194,48,.5)}
html body .nv-ponto.on{width:24px;border-radius:5px;background:var(--yellow);border-color:var(--yellow)}
@media(max-width:820px){
  html body .nv-faixa .nv-in{grid-template-columns:1fr;gap:18px}
  html body .nv-pista .news-card.nv-c,
  html body .nv-pista .news-card,
  html body.teste-branco .nv-pista .news-card{flex:0 0 240px !important;width:240px !important}
  html body .nv-caixa.nv-laco{-webkit-mask-image:none;mask-image:none}
  html body .nv-seta{width:36px;height:36px;font-size:20px}
}
@media(max-width:560px){
  html body .nv-pista .news-card.nv-c,
  html body .nv-pista .news-card,
  html body.teste-branco .nv-pista .news-card{flex:0 0 205px !important;width:205px !important}
  html body .nv-pista{gap:12px}
  html body .nv-seta{display:none}
}

/* ================= BLOCO 110 — contador publico + vista de artigo limpa ================= */
html body #news-nums.nv-nums,
html body.teste-branco #news-nums.nv-nums{
  display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-items:stretch;
  max-width:1100px;margin:clamp(18px,2.2vw,26px) auto 0;padding:0 14px;
}
html body .nv-num{
  background:#0C1016;border:1px solid rgba(242,194,48,.34);border-radius:14px;
  padding:13px 20px 11px;min-width:104px;cursor:pointer;text-align:center;
  display:flex;flex-direction:column;align-items:center;gap:3px;
  transition:border-color .16s ease,transform .16s ease,box-shadow .16s ease,background .16s ease;
}
html body .nv-num b{
  display:block;font-family:'Oswald',sans-serif;font-weight:600;line-height:1;
  font-size:clamp(26px,3.4vw,40px);color:var(--yellow);letter-spacing:-.01em;
}
html body .nv-num span{
  display:block;font-family:'Oswald',sans-serif;font-weight:400;
  font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:#AEB6C2;
}
html body .nv-num:hover{border-color:var(--yellow);transform:translateY(-2px);box-shadow:0 6px 20px rgba(242,194,48,.18)}
html body .nv-num.on{
  background:linear-gradient(180deg,#F7D152 0%,#DCA614 100%);border-color:var(--yellow);
  box-shadow:0 2px 15px rgba(242,194,48,.32),inset 0 1px 0 rgba(255,255,255,.45);
}
html body .nv-num.on b{color:#15120A}
html body .nv-num.on span{color:#3A2D06}
html body .nv-num.nv-tot{min-width:124px;border-width:2px}
html body .nv-num.nv-tot b{font-size:clamp(30px,4vw,48px)}
@media(max-width:560px){
  html body #news-nums.nv-nums{gap:7px}
  html body .nv-num{min-width:82px;padding:10px 12px 9px}
  html body .nv-num.nv-tot{min-width:96px}
  html body .nv-num span{font-size:8.5px;letter-spacing:.14em}
}
/* artigo aberto: fica so o artigo */
html body.blp-art-aberto #news-carousel,
html body.blp-art-aberto #news-carousel.nv-faixa,
html body.teste-branco.blp-art-aberto #news-carousel,
html body.teste-branco.blp-art-aberto #news-carousel.nv-faixa,
html body.blp-art-aberto #news-cats,
html body.teste-branco.blp-art-aberto #news-cats,
html body.blp-art-aberto #news-nums,
html body.teste-branco.blp-art-aberto #news-nums.nv-nums{display:none !important}

/* ================= BLOCO 111 — botao voltar legivel + barra de partilha ================= */
html body .art-wrap > button.adm-btn.ghost,
html body.teste-branco .art-wrap > button.adm-btn.ghost{
  background:#0C1016 !important;border:1px solid var(--yellow) !important;color:#fff !important;
  border-radius:999px;padding:10px 22px;cursor:pointer;
  font-family:'Oswald',sans-serif;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:600;
  opacity:1 !important;text-shadow:none;
  transition:background .16s ease,color .16s ease;
}
html body .art-wrap > button.adm-btn.ghost:hover,
html body.teste-branco .art-wrap > button.adm-btn.ghost:hover{
  background:var(--yellow) !important;color:#15120A !important;
}
/* --- partilha --- */
html body .art-share,
html body.teste-branco .art-share{
  clear:both;margin:34px 0 10px;padding:18px 20px 20px;
  background:#0C1016;border:2px solid rgba(242,194,48,.5);border-radius:16px;
}
html body .art-share .as-tit{
  color:var(--yellow);font-family:'Oswald',sans-serif;font-size:10.5px;font-weight:600;
  letter-spacing:.22em;text-transform:uppercase;margin-bottom:12px;
}
html body .art-share .as-row{display:flex;gap:10px;align-items:stretch;flex-wrap:wrap}
html body .art-share .as-url{
  flex:1 1 280px;min-width:0;background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.18);border-radius:10px;color:#EDF1F6;
  padding:11px 13px;font-family:'SF Mono',Menlo,Consolas,monospace;font-size:12.5px;
}
html body .art-share .as-url:focus{outline:none;border-color:var(--yellow)}
html body .art-share .as-copy{
  flex:0 0 auto;background:linear-gradient(180deg,#F7D152 0%,#DCA614 100%);
  border:1px solid var(--yellow);color:#15120A;border-radius:10px;padding:11px 20px;cursor:pointer;
  font-family:'Oswald',sans-serif;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45);
}
html body .art-share .as-copy:hover{background:linear-gradient(180deg,#FFD95E 0%,#E3AC17 100%)}
html body .art-share .as-copy.ok{background:#1E8E4A;border-color:#1E8E4A;color:#fff}
html body .art-share .as-bts{display:flex;flex-wrap:wrap;gap:9px;margin-top:13px}
html body .art-share .as-bt{
  background:rgba(255,255,255,.04);border:1px solid rgba(242,194,48,.4);color:#D8DDE5 !important;
  border-radius:999px;padding:9px 17px;cursor:pointer;text-decoration:none;
  font-family:'Oswald',sans-serif;font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:500;
  transition:background .16s ease,color .16s ease,border-color .16s ease;
}
html body .art-share .as-bt:hover{background:rgba(242,194,48,.16);border-color:var(--yellow);color:#fff !important}
@media(max-width:560px){
  html body .art-share{padding:15px 15px 17px}
  html body .art-share .as-row{flex-direction:column}
  html body .art-share .as-copy{width:100%}
}

/* ================= BLOCO 112 — chips das noticias legiveis no fundo branco ================= */
html body .news-cat,
html body.teste-branco .news-cat,
html body #news-cats .news-cat,
html body.teste-branco #news-cats .news-cat,
html body #vid-cats .news-cat,
html body.teste-branco #vid-cats .news-cat{
  background:#0C1016 !important;
  border:1px solid rgba(242,194,48,.55) !important;
  color:#EDF1F6 !important;
  text-shadow:none;
}
html body .news-cat:hover,
html body.teste-branco .news-cat:hover,
html body #news-cats .news-cat:hover,
html body.teste-branco #news-cats .news-cat:hover{
  background:#161C25 !important;border-color:var(--yellow) !important;color:#fff !important;
  transform:translateY(-1px);
}
html body .news-cat.on,
html body.teste-branco .news-cat.on,
html body #news-cats .news-cat.on,
html body.teste-branco #news-cats .news-cat.on,
html body #vid-cats .news-cat.on,
html body.teste-branco #vid-cats .news-cat.on{
  background:linear-gradient(180deg,#F7D152 0%,#DCA614 100%) !important;
  border-color:var(--yellow) !important;
  color:#15120A !important;font-weight:700;
  box-shadow:0 2px 15px rgba(242,194,48,.32),inset 0 1px 0 rgba(255,255,255,.48);
  transform:none;
}
html body .news-cat.on:hover,
html body.teste-branco .news-cat.on:hover{
  background:linear-gradient(180deg,#FFD95E 0%,#E3AC17 100%) !important;color:#15120A !important;
}

/* ================= BLOCO 113 — artigo no desenho R5 (+ indice do R2) ================= */
#art-prog{position:fixed;top:0;left:0;right:0;height:3px;z-index:10090;background:rgba(242,194,48,.14);pointer-events:none}
#art-prog i{display:block;height:100%;width:0;background:linear-gradient(90deg,#F7D152,#DCA614);transition:width .08s linear}
html body .art-wrap,
html body.teste-branco .art-wrap{max-width:1180px !important;margin:0 auto;text-align:left}
html body .art-grade,
html body.teste-branco .art-grade{
  display:grid;grid-template-columns:1fr 272px;gap:clamp(24px,3.6vw,54px);
  align-items:start;margin-top:16px;
}
html body .art-main{min-width:0}
html body .art-main .nc-cat{margin-bottom:4px}
html body .art-main h1{margin:6px 0 16px !important;font-size:clamp(26px,3.8vw,44px) !important;line-height:1.12}
html body img.art-capa,
html body.teste-branco img.art-capa{
  float:none !important;max-width:100% !important;width:100% !important;margin:0 0 22px !important;
  border-radius:14px;border:1px solid rgba(242,194,48,.45);display:block;
}
html body .art-body > p:first-of-type,
html body.teste-branco .art-body > p:first-of-type{font-size:18.5px;line-height:1.72;color:#0B0E13}
/* --- barra lateral --- */
html body .art-lado{position:sticky;top:84px;display:grid;gap:13px}
html body .arl-cx{background:#0C1016;border:1px solid rgba(242,194,48,.45);border-radius:14px;padding:15px 16px 13px}
html body .arl-tt{color:var(--yellow);font-family:'Oswald',sans-serif;font-size:9.5px;font-weight:600;
  letter-spacing:.22em;text-transform:uppercase;margin-bottom:10px}
html body .arl-li{display:block;color:#C8CFD9;font-family:'Oswald',sans-serif;font-weight:300;
  font-size:13px;line-height:1.45;padding:8px 0;border-top:1px solid rgba(255,255,255,.09);
  text-decoration:none;border-bottom:0;transition:color .14s ease}
html body .arl-cx .arl-li:first-of-type{border-top:0;padding-top:2px}
html body .arl-li b{display:block;color:#fff;font-weight:500}
html body .arl-li span{display:block;color:#8D95A1;font-size:10px;letter-spacing:.16em;text-transform:uppercase;margin-top:3px}
html body a.arl-li:hover,
html body.teste-branco a.arl-li:hover{color:var(--yellow);background:none}
html body a.arl-li:hover b{color:var(--yellow)}
html body .arl-indice .arl-ix{padding-left:12px;position:relative}
html body .arl-indice .arl-ix::before{content:'';position:absolute;left:0;top:14px;width:5px;height:5px;
  border-radius:50%;background:rgba(242,194,48,.55)}
html body .arl-indice .arl-ix:hover::before{background:var(--yellow)}
html body .arl-bts{display:flex;flex-wrap:wrap;gap:7px}
html body .arl-bt{
  background:rgba(255,255,255,.04);border:1px solid rgba(242,194,48,.4);color:#D8DDE5 !important;
  border-radius:999px;padding:8px 13px;cursor:pointer;text-decoration:none;
  font-family:'Oswald',sans-serif;font-size:10px;letter-spacing:.12em;text-transform:uppercase;font-weight:500;
  transition:background .15s ease,border-color .15s ease,color .15s ease;
}
html body .arl-bt:hover{background:rgba(242,194,48,.16);border-color:var(--yellow);color:#fff !important}
html body .arl-bt.ok{background:#1E8E4A;border-color:#1E8E4A;color:#fff !important}
@media(max-width:980px){
  html body .art-grade,
  html body.teste-branco .art-grade{grid-template-columns:1fr}
  html body .art-lado{position:static;order:2;margin-top:8px}
  html body .arl-indice{display:none}
}
/* o titulo do artigo estava branco sobre branco */
html body .art-main h1,
html body .art-main h1.sec-title,
html body.teste-branco .art-main h1,
html body.teste-branco .art-main h1.sec-title{
  color:#0B0E13 !important;text-shadow:none !important;
  font-family:'Oswald',sans-serif;font-weight:600;letter-spacing:-.01em;
}
html body .art-main .nc-cat,
html body.teste-branco .art-main .nc-cat{color:#8A6C12 !important}
html body .art-wrap > button.adm-btn.ghost,
html body.teste-branco .art-wrap > button.adm-btn.ghost{margin:0 0 18px !important}

/* ---- bloco 115: abertura da frase com a mesma foto da capa (era preto puro) ---- */
html body #blp-tagwall{
  background:
    radial-gradient(74% 48% at 50% 50%, rgba(0,0,0,.72) 0%, rgba(0,0,0,.46) 62%, rgba(0,0,0,.26) 100%),
    linear-gradient(180deg, rgba(0,0,0,.58) 0%, rgba(0,0,0,.34) 46%, rgba(0,0,0,.66) 100%),
    url('/assets/garage_bg.jpg?v=2') center center/cover no-repeat,
    #000 !important;
}
@media(max-width:1024px){
  html body #blp-tagwall{
    background:
      radial-gradient(86% 42% at 50% 50%, rgba(0,0,0,.74) 0%, rgba(0,0,0,.48) 62%, rgba(0,0,0,.28) 100%),
      linear-gradient(180deg, rgba(0,0,0,.60) 0%, rgba(0,0,0,.36) 46%, rgba(0,0,0,.68) 100%),
      url('/assets/garage_bg.jpg?v=2') 58% center/cover no-repeat,
      #000 !important;
  }
}
@media(max-width:640px){
  html body #blp-tagwall{
    background:
      radial-gradient(118% 34% at 50% 50%, rgba(0,0,0,.76) 0%, rgba(0,0,0,.50) 60%, rgba(0,0,0,.30) 100%),
      linear-gradient(180deg, rgba(0,0,0,.62) 0%, rgba(0,0,0,.38) 46%, rgba(0,0,0,.70) 100%),
      url('/assets/garage_bg.jpg?v=2') 63% center/cover no-repeat,
      #000 !important;
  }
}

/* ---- bloco 116: pagina Performance, topo novo (banda + objectivos + quadro) ---- */
#cat-performance .sec-count,
#cat-performance .cat-intro,
#cat-performance .cat-origin,
#cat-performance .plq-escondido{display:none !important}

#cat-performance .plq-band{position:relative;width:100vw;margin-left:calc(50% - 50vw);
  background:linear-gradient(180deg,#0b0e13,#11151c);border-top:3px solid var(--yellow);
  color:#e8ecf2;padding:44px 0 38px;margin-top:26px}
#cat-performance .plq-in{max-width:1180px;margin:0 auto;padding:0 22px}
#cat-performance .plq-flex{display:grid;grid-template-columns:auto 1fr;gap:52px;align-items:center}
#cat-performance .plq-num{font-family:'Racing Sans One',cursive;font-weight:400;
  font-size:clamp(48px,6.8vw,104px);line-height:.9;color:var(--yellow);letter-spacing:1px;
  text-shadow:0 5px 0 rgba(0,0,0,.45);white-space:nowrap}
#cat-performance .plq-num small{display:block;font-family:'Oswald',sans-serif;font-weight:500;font-size:12px;
  letter-spacing:4.5px;color:#98a1ad;text-transform:uppercase;margin-top:14px}
#cat-performance .plq-tx p{margin:0 0 13px;font:300 16.5px/1.8 'Oswald',sans-serif;color:#c6cedb;max-width:70ch}
#cat-performance .plq-tx p:last-child{margin-bottom:0}
#cat-performance .plq-tx p b{color:#fff;font-weight:600}
#cat-performance .plq-tx a{color:var(--yellow);text-decoration:none;border-bottom:1px solid rgba(242,194,48,.55);cursor:pointer}

#cat-performance .plq-nums{display:grid;grid-template-columns:repeat(4,1fr);
  border:1px solid rgba(255,255,255,.14);border-radius:14px;overflow:hidden;
  background:rgba(255,255,255,.03);margin-top:30px}
#cat-performance .plq-nums div{padding:16px 12px;text-align:center;border-right:1px solid rgba(255,255,255,.12)}
#cat-performance .plq-nums div:last-child{border-right:0}
#cat-performance .plq-nums b{display:block;font-family:'Racing Sans One',cursive;font-weight:400;
  font-size:clamp(23px,2.9vw,36px);color:var(--yellow);line-height:1}
#cat-performance .plq-nums span{display:block;margin-top:7px;font:500 11px 'Oswald',sans-serif;
  letter-spacing:2.3px;color:#9aa3b0;text-transform:uppercase}

#cat-performance .plq-obj{max-width:1180px;margin:42px auto 0;padding:0 22px}
#cat-performance .plq-obj h3{text-align:center;margin:0 0 5px;font-family:'Racing Sans One',cursive;
  font-weight:400;font-size:clamp(21px,2.7vw,32px);letter-spacing:.5px;color:#0d0e10}
html body.teste-branco #cat-performance .plq-obj h3{color:#0d0e10 !important}
#cat-performance .plq-obj .plq-sub{text-align:center;margin:0 0 22px;font:300 15px 'Oswald',sans-serif;color:#6b7280}
#cat-performance .plq-tres{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
#cat-performance .plq-op{--ac:#D21F1F;--acs:rgba(210,31,31,.10);--acb:rgba(210,31,31,.30);
  text-align:left;border:1.5px solid #e2e6ec;border-left:5px solid var(--ac);border-radius:16px;
  padding:21px 21px 19px;background:linear-gradient(180deg,#f4f6f9,#eef1f6);cursor:pointer;
  transition:.18s;font-family:'Oswald',sans-serif}
#cat-performance .plq-op[data-g="handling"]{--ac:#0A9E9A;--acs:rgba(10,186,181,.12);--acb:rgba(10,158,154,.32)}
#cat-performance .plq-op[data-g="power"]{--ac:#C79400;--acs:rgba(242,194,48,.18);--acb:rgba(199,148,0,.38)}
#cat-performance .plq-op:hover{transform:translateY(-3px);box-shadow:0 16px 32px rgba(13,14,16,.13);border-color:#d3d9e2;border-left-color:var(--ac)}
#cat-performance .plq-op.on{background:#fff;border-color:var(--ac);border-left-width:5px;box-shadow:0 16px 34px rgba(13,14,16,.16)}
#cat-performance .plq-op .plq-ico{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;
  justify-content:center;font-size:22px;background:var(--acs);border:1px solid var(--acb);margin-bottom:13px}
#cat-performance .plq-op h4{margin:0 0 6px;font:600 19px 'Oswald',sans-serif;letter-spacing:.4px;color:#0d0e10}
#cat-performance .plq-op p{margin:0 0 13px;font:300 14.5px/1.62 'Oswald',sans-serif;color:#4b5461}
#cat-performance .plq-op .plq-tags{display:flex;flex-wrap:wrap;gap:6px}
#cat-performance .plq-op .plq-tags span{font:600 11.5px 'Oswald',sans-serif;letter-spacing:1.2px;
  text-transform:uppercase;color:var(--ac);background:var(--acs);border:1px solid var(--acb);
  border-radius:999px;padding:4px 10px}
#cat-performance .plq-op .plq-mk{display:none;margin-top:12px;font:600 11.5px 'Oswald',sans-serif;
  letter-spacing:2px;color:var(--ac);text-transform:uppercase}
#cat-performance .plq-op.on .plq-mk{display:block}

#cat-performance .plq-quadro{max-width:1180px;margin:34px auto 0;padding:28px 26px 28px;
  background:linear-gradient(180deg,#0f1319,#0b0e13);border:1px solid rgba(255,255,255,.12);
  border-radius:22px;box-shadow:0 22px 46px rgba(10,12,16,.22)}
#cat-performance .plq-cab{display:flex;align-items:center;justify-content:space-between;gap:18px;
  flex-wrap:wrap;margin-bottom:8px}
#cat-performance .plq-cab h3{margin:0;font-family:'Racing Sans One',cursive;font-weight:400;
  font-size:clamp(22px,2.8vw,34px);letter-spacing:.8px;color:#fff;text-transform:uppercase}
#cat-performance .plq-cab h3 em{font-style:normal;color:var(--yellow)}
#cat-performance .plq-busca{display:flex;align-items:center;gap:9px;border:1.5px solid rgba(255,255,255,.2);
  border-radius:999px;padding:9px 16px;min-width:280px;background:rgba(255,255,255,.05)}
#cat-performance .plq-busca:focus-within{border-color:var(--yellow)}
#cat-performance .plq-busca span{color:#8d96a4}
#cat-performance .plq-busca input{border:0;outline:0;flex:1;font:400 14.5px 'Oswald',sans-serif;
  color:#fff;background:transparent}
#cat-performance .plq-busca input::placeholder{color:#79828f}
#cat-performance .plq-lead{margin:0 0 5px;font:300 15.5px/1.7 'Oswald',sans-serif;color:#aab3c0;max-width:76ch}
#cat-performance .plq-lead b{color:#fff;font-weight:600}
#cat-performance .plq-leg{margin:0 0 17px;font:400 11.5px 'Oswald',sans-serif;letter-spacing:1.8px;
  color:#6e7784;text-transform:uppercase}

/* a grelha dos chips passa a cartoes dentro do quadro */
html body #cat-performance .perfsub-row{display:grid !important;
  grid-template-columns:repeat(auto-fill,minmax(212px,1fr)) !important;
  gap:12px !important;max-width:none !important;margin:0 !important;justify-content:stretch !important}
html body #cat-performance .perfsub-chip{display:block !important;position:relative;text-align:left !important;
  background:#171c24 !important;border:1px solid rgba(255,255,255,.12) !important;border-radius:14px !important;
  padding:15px 15px 13px !important;transition:.18s;color:#eef2f7 !important;
  white-space:normal !important;overflow:visible !important}
html body #cat-performance .perfsub-chip:hover{border-color:var(--yellow) !important;background:#1c222c !important;
  transform:translateY(-2px);box-shadow:0 12px 24px rgba(0,0,0,.35)}
#cat-performance .perfsub-chip .plq-lin{display:flex;align-items:flex-start;gap:9px;min-height:44px;margin-bottom:10px}
#cat-performance .perfsub-chip .pc-ico{font-size:19px !important;line-height:1.3;flex:none}
#cat-performance .perfsub-chip .plq-nm{flex:1;min-width:0;white-space:normal;word-break:break-word;
  font:600 15px/1.2 'Oswald',sans-serif;letter-spacing:.3px;color:#eef2f7}
#cat-performance .perfsub-chip .pc-n{font-family:'Racing Sans One',cursive !important;font-size:19px !important;
  color:#fff !important;letter-spacing:.5px;line-height:1.1;flex:none}
#cat-performance .perfsub-chip .plq-bar{display:block;height:6px;border-radius:99px;
  background:rgba(255,255,255,.10);overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,255,255,.05)}
#cat-performance .perfsub-chip .plq-bar s{display:block;height:100%;min-width:3px;text-decoration:none;
  background:linear-gradient(90deg,var(--yellow),#e0a800);border-radius:99px}
#cat-performance .perfsub-chip .plq-pc{display:block;margin-top:7px;font:400 11.5px 'Oswald',sans-serif;
  letter-spacing:1.3px;color:#79828f;text-transform:uppercase}
html body #cat-performance .perfsub-chip.on{background:var(--yellow) !important;border-color:var(--yellow) !important}
#cat-performance .perfsub-chip.on .plq-nm,#cat-performance .perfsub-chip.on .pc-n{color:#141414 !important}
#cat-performance .perfsub-chip.on .plq-bar{background:rgba(0,0,0,.22);box-shadow:none}
#cat-performance .perfsub-chip.on .plq-bar s{background:#141414}
#cat-performance .perfsub-chip.on .plq-pc{color:#5a4a04}
#cat-performance .perfsub-chip.plq-fora{opacity:.26;filter:grayscale(1)}
#cat-performance .perfsub-chip.plq-realce{border-color:var(--yellow) !important;box-shadow:0 0 0 2px rgba(242,194,48,.35)}
#cat-performance .perfsub-chip.plq-oculto{display:none !important}

@media(max-width:980px){
  #cat-performance .plq-flex{grid-template-columns:1fr;gap:20px}
  #cat-performance .plq-nums{grid-template-columns:repeat(2,1fr)}
  #cat-performance .plq-tres{grid-template-columns:1fr}
}
@media(max-width:640px){
  #cat-performance .plq-quadro{padding:20px 16px;border-radius:16px}
  #cat-performance .plq-busca{min-width:0;width:100%}
}

/* ---- bloco 119: paginas de marca no desenho M2 (ficha + texto + atalhos) ---- */
.brand-page .bm-grid{display:grid;grid-template-columns:360px 1fr;gap:46px;align-items:start;
  margin:clamp(38px,5vw,70px) 0 0}
.brand-page .bm-card{border:1px solid #e4e7ec;border-radius:18px;overflow:hidden;background:#fff;
  box-shadow:0 14px 34px rgba(13,14,16,.10);position:sticky;top:86px}
.brand-page .bm-card .brand-split-img{margin:0}
.brand-page .bm-card img{width:100%;display:block;border-radius:0}
.brand-page .bm-ficha{padding:4px 18px 16px}
.brand-page .bm-ficha .lin{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid #e4e7ec}
.brand-page .bm-ficha .lin:last-child{border-bottom:0}
.brand-page .bm-ficha .k{font:500 12px 'Oswald',sans-serif;letter-spacing:2px;text-transform:uppercase;color:#6b7280}
.brand-page .bm-ficha .v{font:600 15px 'Oswald',sans-serif;color:#0d0e10;text-align:right}
.brand-page .bm-ficha .v.g{font-family:'Racing Sans One',cursive;font-weight:400;font-size:19px;color:#C79400}

.brand-page .bm-main{min-width:0}

/* CONTRASTE: o texto estava escrito para fundo escuro */
html body .brand-page .bm-tx p{color:#3b434e !important;font:300 16.5px/1.82 'Oswald',sans-serif;margin:0 0 15px;max-width:68ch}
html body .brand-page .bm-tx p strong,
html body .brand-page .bm-tx p b{color:#0d0e10 !important;font-weight:600}
html body .brand-page .bm-tx p a,
html body .brand-page .bm-tx a.xlink{color:#8a6a00 !important;font-weight:600;text-decoration:none;
  border-bottom:2px solid var(--yellow)}

.brand-page .bm-tt{margin:28px 0 12px;font:600 12px 'Oswald',sans-serif;letter-spacing:2.6px;
  text-transform:uppercase;color:#8a6a00}
.brand-page .bm-chips{display:flex;flex-wrap:wrap;gap:9px}
.brand-page .bm-chip{display:inline-flex;align-items:center;gap:10px;cursor:pointer;
  border:1.5px solid #dbe0e8;border-radius:12px;padding:10px 15px;
  background:linear-gradient(180deg,#f4f6f9,#eceff5);
  font-family:'Oswald',sans-serif;transition:.16s;box-shadow:0 1px 0 #fff inset}
.brand-page .bm-chip:hover{border-color:var(--yellow);background:linear-gradient(180deg,#fffdf4,#fff8e3);
  transform:translateY(-2px);box-shadow:0 10px 20px rgba(13,14,16,.10)}
.brand-page .bm-chip em{font-style:normal;font:600 14.5px 'Oswald',sans-serif;letter-spacing:.3px;color:#0d0e10}
.brand-page .bm-chip b{font-family:'Racing Sans One',cursive;font-weight:400;font-size:15px;color:#C79400}
.brand-page .bm-chip i{font-style:normal;font-size:13px;color:#9aa3b0;transition:.16s}
.brand-page .bm-chip:hover i{color:#8a6a00;transform:translateX(2px)}
.brand-page .bm-chip.on{background:var(--dark,#0C1016);border-color:var(--dark,#0C1016)}
.brand-page .bm-chip.on em{color:#fff}
.brand-page .bm-chip.on b{color:var(--yellow)}
.brand-page .bm-chip.on i{color:var(--yellow)}
.brand-page .bm-nota{margin:12px 0 0;font:400 12px 'Oswald',sans-serif;letter-spacing:1.4px;
  color:#6b7280;text-transform:uppercase}

@media(max-width:980px){
  .brand-page .bm-grid{grid-template-columns:1fr;gap:26px}
  .brand-page .bm-card{position:static;max-width:460px;margin:0 auto}
}

/* ===== O Braga (19/10/2026): a paginacao estava ilegivel ==================
   Medido em /performance/aem, catalogo ja renderizado, 11 paginas:
     .pg-info   "Page 1 / 11"  -> #c3c9d2 sobre #ffffff   = 1.6:1  (ilegivel)
     .pg-dots   "..."          -> #9aa2ad sobre #ffffff   = 2.6:1  (fraco)
     .pg-btn.on "1"            -> fundo #eef0f4, igual aos outros botoes
                                  -> nao se ve em que pagina se esta
   Tres historias no mesmo sitio: a linha ~7496 pos o texto escuro, a ~7534
   repetiu, e a ~7580 voltou a por claro com o comentario "a barra de paginas
   vive dentro do .prod-block, que escureci". Isso deixou de ser verdade: o
   unico sitio escuro dentro do bloco e o .prod-note, que tem fundo proprio
   rgba(12,14,18,.88) e por isso mantem a letra clara. O .prod-pager assenta
   no branco da pagina - medido bgReal = rgb(255,255,255) em /performance/aem
   e o tema vivo e sempre body.teste-branco. Logo: texto escuro.
   O botao activo perdeu o dourado porque a linha ~7493 forca
   background:#eef0f4 !important em todos os .pg-btn, e o .pg-btn.on da linha
   3521 nao tem !important. Devolve-se-lhe o dourado. */
body.teste-branco .prod-pager .pg-info{color:#2b313a !important;font-weight:500}
body.teste-branco .prod-pager .pg-dots{color:#4a515c !important}
body.teste-branco .prod-pager button,
body.teste-branco .prod-pager .pg-btn{color:#15181d !important;
  border-color:#b9c1cc !important}
body.teste-branco .prod-pager .pg-btn.on{background:var(--gold,#F2C230) !important;
  color:#15181d !important;border-color:#c79400 !important;font-weight:700 !important}
body.teste-branco .prod-pager .pg-btn:hover:not(:disabled):not(.on){
  background:#fff6dc !important;border-color:#c79400 !important}

/* Enquanto o catalogo carrega a paginacao fica apagada de proposito - para
   ninguem ler "pagina 1 de 3" como final quando ainda vao chegar paginas.
   Mas .35 em cima de um texto que ja era claro dava invisivel. Com o texto
   escuro, .62 chega para se perceber que ainda nao esta pronto e continua a
   ler-se. */
body.teste-branco .prod-block.blp-carregando .prod-pager,
.prod-block.blp-carregando [class*=pag]{opacity:.62}

/* ===== O Braga (19/10/2026): o aviso de carregamento numa pagina de marca ==
   O aviso e global ("Loading the full catalog... 34,775 products in so far")
   e e posto em cada .prod-block que esteja a ser visto. Numa pagina de marca
   isso punha o total do site inteiro debaixo de uma tabela que so mostra uma
   marca - em /performance/aem lia-se 34,775 numa pagina de 426 produtos AEM.
   O aviso em si tem de ficar: o catalogo esta mesmo a carregar e a contagem
   da marca ainda esta a crescer. So muda a frase. O JS escreve a frase certa
   em data-bm-aviso (um atributo, que sobrevive aos innerHTML de 350ms do
   pintor) e aqui troca-se o texto por ela. */
/* o display e'so enquanto carrega: a regra base e .blp-carga{display:none}
   e um !important solto aqui deixava o aviso na pagina para sempre depois do
   catalogo chegar (apanhado em teste: classe blp-carregando fora, aviso ainda
   visivel). Por isso leva a mesma condicao do original. */
.brand-page .prod-block.blp-carregando .blp-carga[data-bm-aviso]{
  display:flex !important;flex-wrap:wrap;align-items:center;gap:0 8px}
.brand-page .blp-carga[data-bm-aviso] .fc-dot{order:1}
.brand-page .blp-carga[data-bm-aviso]::before{order:2;content:attr(data-bm-aviso);
  font-weight:700}
.brand-page .blp-carga[data-bm-aviso] strong,
.brand-page .blp-carga[data-bm-aviso] .blp-carga-n{display:none !important}
.brand-page .blp-carga[data-bm-aviso] .blp-barra{order:3;flex:1 0 100%}

/* ===== O Braga (20/10/2026): pagina dos Body Kits, desenho D1 ============
   Aprovado por ele a partir do ficheiro FINAL-D1. A pagina passa a alternar
   faixas de ponta a ponta, com uma linha dourada a fechar cada uma:

     titulo (ja existia)
     > preto   : o numero real de pecas + as duas linhas (Blacklist / Auto-R)
     > branco  : o que e / o que faz / como escolher + a origem
     > preto   : a PRODUCAO, com os videos reais - e a prova de que os kits
                 sao nossos. O Braga: "produtos vindo da China as pessoas nao
                 confiam, mas eu tenho que ser honesto... se nao tiver
                 comprovacoes disso as pessoas nao vao confiar". Por isso os
                 videos sobem para aqui, logo a seguir ao texto, em vez de
                 ficarem perdidos no fim.
     > branco  : as marcas, em grelha com barra real
     > escuro  : a pesquisa, tal como ja estava

   Nada foi reconstruido: as marcas continuam a ser o carrossel do site
   (#bk-carousel), so que vestido de grelha, para os botoes Blacklist/Auto-R
   continuarem a trocar a lista como sempre fizeram. */

/* ---- 1. faixa preta do numero ---- */
#cat-bodykits .bkd-banda{
  background:radial-gradient(1200px 420px at 50% -10%,#23262d,#0d0e10 70%);
  color:#fff;padding:54px 0 48px;border-top:3px solid var(--gold,#F2C230);
  border-bottom:3px solid var(--gold,#F2C230)}
#cat-bodykits .bkd-in{max-width:1180px;margin:0 auto;padding:0 24px}
#cat-bodykits .bkd-topo{display:flex;align-items:flex-end;gap:38px;flex-wrap:wrap}
#cat-bodykits .bkd-num{font-family:Oswald,sans-serif;font-weight:700;
  font-size:clamp(72px,12vw,152px);line-height:.84;
  background:linear-gradient(180deg,#fff 20%,var(--gold,#F2C230));
  -webkit-background-clip:text;background-clip:text;color:transparent}
#cat-bodykits .bkd-num small{display:block;font-size:12px;letter-spacing:.3em;
  color:var(--gold,#F2C230);-webkit-text-fill-color:var(--gold,#F2C230);margin-top:14px;font-weight:600}
#cat-bodykits .bkd-tx{flex:1 1 380px;color:#c9cfd8;font-size:16.5px;max-width:580px;line-height:1.6}
#cat-bodykits .bkd-tx b{color:#fff}

/* ---- os tres botoes de linha, desenho S5 (escolhido pelo Braga) ----
   ALL / Blacklist / Auto-R em linhas largas: placa do logotipo a esquerda,
   o que e ao meio, numero e estado a direita. O logotipo passou de 64px para
   uma placa de 76px e enche-a - era isso que o fazia parecer apagado. */
#cat-bodykits .bkd-banda .bk-seg-toggle{display:grid !important;grid-template-columns:1fr;
  gap:14px;margin:38px auto 0 !important;max-width:1000px;
  background:none !important;border:0 !important;padding:0 !important}
#cat-bodykits .bkd-banda .bk-seg{
  display:grid !important;grid-template-columns:230px 1fr auto;align-items:center;gap:26px;
  text-align:left !important;cursor:pointer;color:#fff !important;
  background:linear-gradient(90deg,#171a1f,#121418) !important;
  border:1px solid #2b303a !important;border-radius:18px !important;
  padding:20px 26px !important;transition:.16s;width:100%}
#cat-bodykits .bkd-banda .bk-seg:hover{border-color:#4a5160 !important;transform:translateX(3px)}
#cat-bodykits .bkd-banda .bk-seg.on{border-color:var(--gold,#F2C230) !important;
  background:linear-gradient(90deg,#231f12,#121418) !important}
#cat-bodykits .bks-marca{height:88px;border-radius:12px;background:#0b0c0e;border:1px solid #23272e;
  display:flex;align-items:center;justify-content:center;padding:10px;flex-wrap:nowrap;overflow:hidden}
#cat-bodykits .bks-marca img{max-height:68px;max-width:94%;width:auto !important;height:auto !important;
  object-fit:contain;display:block;margin:0 !important;filter:none !important;opacity:1 !important}
/* a palavra tem de caber numa linha mesmo que a Oswald nao carregue, e as
   cores levam !important porque ha regras do site a pintar tudo dentro do
   botao (era isso que as deixava desmaiadas) */
#cat-bodykits .bks-wm{display:inline-block !important;white-space:nowrap !important;width:auto !important;
  font-family:Oswald,Impact,sans-serif;font-weight:700;font-size:26px;
  letter-spacing:.16em;color:var(--gold,#F2C230) !important;line-height:1;
  text-transform:uppercase;opacity:1 !important}
#cat-bodykits .bks-wm.bks-ar{font-size:30px;letter-spacing:.04em;color:#fff !important}
#cat-bodykits .bks-wm.bks-ar i{display:inline !important;font-style:normal !important;
  color:#d21f1f !important;margin:0 .04em;font-size:inherit;line-height:inherit}
@media(max-width:1100px){#cat-bodykits .bks-wm{font-size:22px}
  #cat-bodykits .bks-wm.bks-ar{font-size:25px}}
#cat-bodykits .bks-tx b{display:block;font-family:Oswald,sans-serif;font-weight:600;font-size:20px;
  color:#fff !important;line-height:1.2;margin-bottom:4px}
#cat-bodykits .bks-tx small{display:block;color:#99a1ac !important;font-size:13.5px;line-height:1.5;
  font-family:Inter,system-ui,sans-serif}
#cat-bodykits .bks-dir{text-align:right;min-width:150px}
#cat-bodykits .bks-dir b{display:block;font-family:Oswald,sans-serif;font-weight:700;font-size:30px;
  color:var(--gold,#F2C230) !important;line-height:1}
#cat-bodykits .bks-dir > span{display:block;font:600 10px Oswald,sans-serif;letter-spacing:.2em;
  color:#7d858f !important;margin-top:5px}
#cat-bodykits .bks-dir i{display:inline-block;font-style:normal;margin-top:10px;
  font:700 9.5px Oswald,sans-serif;letter-spacing:.16em;border-radius:999px;padding:5px 12px;
  background:#2a2f38;color:#c3cad3 !important}
#cat-bodykits .bk-seg.on .bks-dir i{background:var(--gold,#F2C230);color:#0d0e10 !important}
#cat-bodykits .bk-seg[data-seg="autor"] .bks-dir i{background:#3a1b1b;color:#ff9b9b !important}
#cat-bodykits .bk-seg[data-seg="autor"].on .bks-dir i{background:#d21f1f;color:#fff !important}
@media(max-width:900px){
  #cat-bodykits .bkd-banda .bk-seg{grid-template-columns:1fr;gap:14px}
  #cat-bodykits .bks-dir{text-align:left}
}

/* ---- 2. faixa branca do texto ---- */
/* A seccao tem 80px de recuo de cada lado. As faixas tem de ir de ponta a
   ponta, por isso tira-se o recuo DELA e da-se o recuo a cada caixa interior.
   Sem isto ficavam duas tiras brancas nos lados, que foi o que o Braga viu. */
#cat-bodykits{padding-left:0 !important;padding-right:0 !important}

/* o .section-body volta a ser so o titulo da pagina, como era */
#cat-bodykits .section-body{max-width:none !important;width:auto !important;
  padding-left:0 !important;padding-right:0 !important}
/* a faixa branca do texto e nossa, e vem depois do numero */
#cat-bodykits .bkd-texto{background:#fff;border-top:3px solid var(--gold,#F2C230);
  border-bottom:3px solid var(--gold,#F2C230);padding:44px 0 46px}
#cat-bodykits .bkd-texto > *{max-width:1180px;margin-left:auto;margin-right:auto;
  padding-left:24px;padding-right:24px}
/* O .sec-title e o .eyebrow NAO se escondem: sao o titulo da pagina, a faixa
   com "CARBON-FIBRE BODY KITS / BODY KITS". Escondi-os na primeira versao e o
   topo ficou sem titulo nenhum. O bloco 127 move-os para cima da faixa do
   numero; aqui so sai a contagem antiga ("670+ parts"), que o numero grande
   substitui e ja estava desactualizada. */
#cat-bodykits .section-body > .sec-count,
#cat-bodykits > .sec-count{display:none !important}
#cat-bodykits > .eyebrow,#cat-bodykits > .sec-title{position:relative;z-index:2}
#cat-bodykits .cat-intro{display:grid !important;grid-template-columns:repeat(3,1fr);gap:30px;
  max-width:1180px !important}
#cat-bodykits .cat-intro p{margin:0 !important;color:#2d343d !important;font-size:16px !important;
  line-height:1.64 !important;padding-left:19px;border-left:4px solid var(--gold,#F2C230)}
#cat-bodykits .cat-intro p strong,#cat-bodykits .cat-intro p b{color:#0d0e10 !important;
  display:block;font-family:Oswald,sans-serif;font-weight:600;font-size:21px;margin:0 0 9px -19px;
  padding-left:19px}
#cat-bodykits #bk-origin{margin:32px auto 0 !important;display:flex;gap:14px;align-items:center;
  justify-content:center;border-top:1px solid #e3e7ec;padding-top:22px !important;
  background:none !important;border-radius:0 !important}
#cat-bodykits #bk-origin .co-flag{font-size:22px}
#cat-bodykits #bk-origin .co-tx{color:#4a525c !important;font-size:14px;text-align:center;max-width:740px}
#cat-bodykits #bk-origin .co-tx b,#cat-bodykits #bk-origin .co-tx strong{color:#0d0e10 !important}

/* ---- 3. faixa preta da producao (os videos) ---- */
#cat-bodykits #bk-media{background:linear-gradient(180deg,#0d0e10,#16181d);
  border-bottom:3px solid var(--gold,#F2C230);padding:44px 0 48px !important;margin:0 !important;
  max-width:none !important}
#cat-bodykits #bk-media > *{max-width:1180px;margin-left:auto;margin-right:auto;
  padding-left:24px;padding-right:24px}
#cat-bodykits #bk-media .pv-head{text-align:center}
#cat-bodykits #bk-media .pv-t{font-family:Oswald,sans-serif;font-weight:600;
  font-size:clamp(26px,3.6vw,38px);color:#fff !important;letter-spacing:.02em}
/* o cabecalho ja traz um risco dourado proprio - o meu fazia dois */
#cat-bodykits #bk-media .pv-s{color:#aab2bd !important;font-size:15px;max-width:640px;margin:0 auto}
/* o aviso de honestidade, posto pelo bloco 127 */
#cat-bodykits .bkd-prova{max-width:780px;margin:22px auto 26px;background:rgba(242,194,48,.09);
  border:1px solid rgba(242,194,48,.4);border-radius:12px;padding:14px 20px;text-align:center}
#cat-bodykits .bkd-prova p{margin:0;color:#e4d9b4;font-size:14px;line-height:1.55}
#cat-bodykits .bkd-prova b{color:var(--gold,#F2C230)}
#cat-bodykits .bkd-selos{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:26px}
#cat-bodykits .bkd-selos span{border:1px solid rgba(255,255,255,.2);border-radius:999px;
  padding:8px 16px;font:600 10.5px Oswald,sans-serif;letter-spacing:.2em;color:#d3d9e0}
#cat-bodykits .bkd-selos span b{color:var(--gold,#F2C230);font-weight:600}

/* ---- 4. faixa branca das marcas (o carrossel, vestido de grelha) ---- */
#cat-bodykits .bkd-marcas{background:#fff;border-bottom:3px solid var(--gold,#F2C230);
  padding:44px 0 48px}
#cat-bodykits #bk-carousel-title{max-width:1180px;margin:0 auto 20px !important;padding:0 24px;
  font-family:Oswald,sans-serif;font-weight:600;font-size:29px;color:#0d0e10 !important;
  text-align:left !important}
#cat-bodykits #bk-carousel{display:grid !important;grid-template-columns:repeat(4,1fr);gap:12px;
  max-width:1180px;margin:0 auto !important;padding:0 24px;overflow:visible !important;
  white-space:normal !important}
#cat-bodykits #bk-carousel .mw-card{position:relative;display:block !important;width:auto !important;
  min-width:0 !important;background:#f3f5f8 !important;border:1.5px solid #c3cbd5 !important;
  border-bottom:3px solid #a8b1bd !important;border-radius:12px !important;
  padding:15px 16px 16px !important;margin:0 !important;text-decoration:none;transition:.15s}
#cat-bodykits #bk-carousel .mw-card:hover{border-color:#8a6a00 !important;
  border-bottom-color:#8a6a00 !important;background:#fffdf3 !important;transform:translateY(-2px)}
#cat-bodykits #bk-carousel .mw-card *{color:#0d0e10 !important}
/* os nomes reais das classes sao .mw-cname e .mw-cdesc - um selector largo
   a span punha tudo a 11,5px cinzento e os cartoes pareciam vazios */
#cat-bodykits #bk-carousel .mw-card .mw-ico{display:flex !important;align-items:center;
  justify-content:flex-start;height:40px;width:auto !important;margin:0 0 10px !important;
  background:none !important;border:0 !important}
#cat-bodykits #bk-carousel .mw-card .mw-ico img{max-height:34px;max-width:96px;width:auto !important;
  height:auto !important;object-fit:contain;filter:none}
#cat-bodykits #bk-carousel .mw-card .mw-cname{display:block !important;font-family:Oswald,sans-serif;
  font-weight:600;font-size:16.5px;color:#0d0e10 !important;line-height:1.2}
#cat-bodykits #bk-carousel .mw-card .mw-cdesc{display:block !important;font-size:12px;
  color:#5c646f !important;letter-spacing:.04em;margin-top:2px}
#cat-bodykits .bkd-bar{display:block;height:6px;border-radius:999px;background:#d7dde4;
  overflow:hidden;margin-top:11px}
#cat-bodykits .bkd-bar i{display:block;height:100%;border-radius:999px;
  background:linear-gradient(90deg,#8a6a00,var(--gold,#F2C230))}
#cat-bodykits .bkd-pe{max-width:1180px;margin:22px auto 0;padding:0 24px;text-align:center;
  color:#454d58;font-size:13.5px}
#cat-bodykits .bkd-pe b{color:#0d0e10}
/* a dica de arrastar nao faz sentido numa grelha */
#cat-bodykits .mw-crumb{display:none !important}

/* ---- 5. a pesquisa, em faixa escura a fechar ---- */
#cat-bodykits .bkd-filtro{background:#15171c;padding:44px 0 50px}

@media(max-width:980px){
  #cat-bodykits .cat-intro{grid-template-columns:1fr !important}
  #cat-bodykits .bkd-banda .bk-seg-toggle{grid-template-columns:1fr}
  #cat-bodykits #bk-carousel{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  #cat-bodykits #bk-carousel{grid-template-columns:1fr}
  #cat-bodykits .bkd-in,#cat-bodykits .section-body > *,#cat-bodykits #bk-media > *,
  #cat-bodykits #bk-carousel,#cat-bodykits #bk-carousel-title{padding-left:16px;padding-right:16px}
}

/* numa grelha os clones do carrossel nao fazem sentido (bloco 127 tira-os do
   DOM; isto e a rede, caso o motor volte a por algum) */
#cat-bodykits #bk-carousel [data-clone],
#cat-bodykits #bk-carousel [aria-hidden="true"]{display:none !important}

/* ---- como se compra cada linha (bloco 127) ----
   A Blacklist e sob encomenda, a Auto-R ja esta pronta. Sao dois caminhos
   diferentes dentro da mesma categoria, e o cliente tem de ver isso antes de
   escolher. */
#cat-bodykits .bkd-compra{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:16px}
#cat-bodykits .bkd-compra:has(.bkd-c:only-child){grid-template-columns:1fr}
#cat-bodykits .bkd-c{border:1px solid rgba(255,255,255,.14);border-left:3px solid var(--gold,#F2C230);
  border-radius:12px;padding:14px 18px;background:rgba(255,255,255,.035)}
#cat-bodykits .bkd-c.bkd-compra-ar{border-left-color:#d21f1f}
#cat-bodykits .bkd-c b{display:block;font-family:Oswald,sans-serif;font-weight:600;font-size:14.5px;
  color:#fff;letter-spacing:.02em;margin-bottom:5px}
#cat-bodykits .bkd-c span{display:block;color:#aab2bd;font-size:13.5px;line-height:1.5}
@media(max-width:980px){#cat-bodykits .bkd-compra{grid-template-columns:1fr}}

/* O motor do carrossel embrulha os cartoes numa .blq-track e arrasta-a com
   transform. Numa grelha isso punha os 14 cartoes numa tira de 3556px.
   display:contents faz a pista desaparecer como caixa - os cartoes passam a
   ser filhos da grelha - e o transform deixa de ter efeito. Resolve mesmo
   que o motor volte a embrulhar. */
#cat-bodykits #bk-carousel .blq-track{display:contents !important}
#cat-bodykits #bk-carousel{overflow:visible !important;white-space:normal !important}
#cat-bodykits #bk-carousel .blq-seta,#cat-bodykits #bk-carousel .blq-bar{display:none !important}

/* acabamento da grelha das marcas: sem italico, alinhado a esquerda, e os
   cantinhos coloridos (--ac) todos no dourado da casa em vez de vermelho e
   turquesa a esmo */
#cat-bodykits #bk-carousel .mw-card{--ac:#C79400 !important;text-align:left !important}
#cat-bodykits #bk-carousel .mw-card .mw-cname{font-style:normal !important;
  text-align:left !important;text-transform:none !important;letter-spacing:.01em}
#cat-bodykits #bk-carousel .mw-card .mw-cdesc{font-style:normal !important;text-align:left !important}
/* se o logotipo nao vier, a caixa vazia nao fica a marcar presenca */
#cat-bodykits #bk-carousel .mw-card .mw-ico{min-height:0;height:auto}
#cat-bodykits #bk-carousel .mw-card .mw-ico:empty{display:none !important}
#cat-bodykits #bk-carousel .mw-card .mw-ico img{display:block}

/* as faixas ocupam a largura da seccao (que ja nao tem recuo lateral) e o
   conteudo de cada uma leva o seu proprio recuo */
#cat-bodykits .bkd-banda,#cat-bodykits #bk-media,
#cat-bodykits .bkd-marcas,#cat-bodykits .bkd-filtro{width:auto;margin-left:0;margin-right:0}
#cat-bodykits .bkd-filtro > *{max-width:1180px;margin-left:auto;margin-right:auto;
  padding-left:24px;padding-right:24px}

#cat-bodykits .bkd-texto{width:auto;margin:0}

/* os quadros .bkd-compra sairam: o que diziam esta agora dentro de cada botao */
#cat-bodykits .bkd-compra{display:none !important}

/* ================= BLOCO 142 — body kits: como se encomenda =================
   A janela que salta ao abrir os body kits, com o botao de "compreendo".
   Mesma familia do aviso legal dos escapes (.age-ov / .exl-ov), mas com as
   duas linhas separadas: a Auto-R a dourado, a Blacklist a branco. */
.bka-ov .bka-modal{border-color:rgba(242,194,48,.5);max-width:560px}
.bka-ov .bka-badge{background:var(--yellow,#F2C230);color:#15120A;font-size:26px;line-height:1}
.bka-ov .bka-linhas{display:flex;flex-direction:column;gap:12px;text-align:left;margin-bottom:16px}
.bka-ov .bka-linha{display:flex;flex-direction:column;gap:6px;
  background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.10);
  border-left:3px solid rgba(255,255,255,.22);border-radius:12px;padding:14px 16px}
.bka-ov .bka-linha.bka-ar{border-left-color:var(--yellow,#F2C230)}
.bka-ov .bka-linha.bka-bl{border-left-color:#FFFFFF}
.bka-ov .bka-eti{font-family:'Oswald',sans-serif;font-weight:600;font-size:12px;
  letter-spacing:.14em;text-transform:uppercase;color:#FFFFFF}
.bka-ov .bka-linha.bka-ar .bka-eti{color:var(--yellow,#F2C230)}
.bka-ov .bka-txt{color:#D7DAE0;font-family:'Oswald',sans-serif;font-weight:300;
  font-size:13px;line-height:1.5}
.bka-ov .bka-dep{color:#FFFFFF;font-weight:400}
.bka-ov .bka-gar{display:flex;align-items:center;justify-content:center;gap:8px;
  color:var(--yellow,#F2C230);font-family:'Oswald',sans-serif;font-weight:500;
  font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:18px}
.bka-ov .bka-btn{background:var(--yellow,#F2C230);color:#15120A;border:0;font-weight:600;
  box-shadow:0 10px 26px -10px rgba(242,194,48,.6)}
.bka-ov .bka-btn:hover{background:#FFD24A;color:#15120A}
@media(max-width:640px){
  .bka-ov .bka-modal{padding:26px 20px}
  .bka-ov .bka-linha{padding:12px 13px}
  .bka-ov .bka-txt{font-size:12.5px}
  .bka-ov .bka-gar{font-size:11.5px}
}
/* o botao para voltar a abrir, por baixo dos tres botoes */
#bka-rever{display:block;margin:22px auto 0;background:#0C1016;color:#FFFFFF;
  border:2px solid rgba(242,194,48,.55);border-radius:999px;padding:10px 22px;
  font-family:'Oswald',sans-serif;font-weight:500;font-size:12px;letter-spacing:.14em;
  text-transform:uppercase;cursor:pointer;line-height:1.2}
#bka-rever:hover{border-color:var(--yellow,#F2C230);background:#14191F}

/* ================= BLOCO 143 — o dedo acerta sempre =======================
   O Braga (20/10/2026): "o mobile e para ser navegavel, sem nenhum bug".
   Medido ao vivo num telemovel: os pontinhos do carrossel das noticias tem
   8 px de largura e os X de fechar 15 a 22 px. Com o dedo, acerta-se uma
   vez em tres. Aqui NAO se muda o aspecto de nada: acrescenta-se por cima
   uma area invisivel de 44 px, que e a medida a que o dedo responde bem.
   So em ecras de toque - no computador, com o rato, fica tudo igual.    */
@media (pointer:coarse){
  html body .nv-ponto,
  #promo-banner .pb-x,
  .mob-drawer-x,
  .model-chip,
  .news-cat{ position:relative; }
  html body .nv-ponto::after,
  #promo-banner .pb-x::after,
  .mob-drawer-x::after{
    content:''; position:absolute; top:50%; left:50%;
    transform:translate(-50%,-50%);
    width:44px; height:44px; min-width:100%; min-height:100%;
    border-radius:inherit; background:transparent; pointer-events:auto;
  }
  /* os pontinhos ficam mais afastados para as areas nao se sobreporem */
  html body .nv-pontos{ gap:14px; }
}

/* ================= BLOCO 144 — rodas: as bandas do M3 =====================
   O Braga escolheu o M3: faixa do titulo (carbono) -> BRANCO -> ESCURO ->
   CLARO, com as bordas douradas a separar, como nos body kits.
   As bandas vivem dentro do .section-body (que e estreito e centrado), por
   isso cada uma estica-se ate a ponta do ecra com a margem negativa que o
   bloco 144 mede e escreve em --rmz-esq / --rmz-dir. Assim nao e preciso
   mexer no overflow da seccao nem no resto da pagina.                      */
#cat-wheels .rmz{
  margin-left:calc(-1 * var(--rmz-esq, 0px));
  margin-right:calc(-1 * var(--rmz-dir, 0px));
  position:relative;
}
#cat-wheels .rmz-in{max-width:1180px;margin:0 auto;padding:0 26px}
@media(max-width:720px){#cat-wheels .rmz-in{padding:0 16px}}

/* ---------- BANDA 1 : branca ---------- */
/* O Braga (21/10/2026): "onde esta o titulo, a linha de cima esta ok, a de
   baixo nao, e vem outra linha dourada do quadro de baixo - e so para ter
   uma ali". A faixa de carbono do titulo ja acaba com um risco dourado de
   4px; esta banda vinha acrescentar o seu, com 26px de branco pelo meio.
   Tira-se o risco de cima e o espaco: fica um so, o da faixa do titulo. */
#cat-wheels .rmz-hero{
  background:linear-gradient(180deg,#FFFFFF,#F2F3F5);
  border-top:0;
  border-bottom:3px solid var(--gold,#F2C230);
  padding:52px 0 56px;margin-top:0}
#cat-wheels .rmz-g{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:46px;align-items:start}
#cat-wheels .rmz-claim .sec-count,
#cat-wheels .rmz-claim .bp-claim{
  margin:0 !important;max-width:none !important;width:auto !important;background:none !important;
  font-size:clamp(28px,4.2vw,52px) !important;font-weight:600 !important;font-style:italic !important;
  line-height:1.03 !important;color:#15181D !important;text-align:left !important;letter-spacing:.005em !important;
  overflow:visible !important;text-transform:uppercase !important;opacity:1 !important}
#cat-wheels .rmz-lead{color:#515864;font-weight:300;font-size:16px;line-height:1.6;margin:14px 0 0;max-width:58ch}
#cat-wheels .rmz-passos{display:flex;gap:10px;margin-top:28px;flex-wrap:wrap}
#cat-wheels .rmz-passo{flex:1 1 150px;background:#fff;border:1px solid #E2E5EA;border-radius:14px;
  padding:15px 16px 17px;box-shadow:0 2px 10px -7px rgba(14,17,22,.35)}
#cat-wheels .rmz-passo b{display:block;color:#A8801A;font-size:11px;letter-spacing:.2em;
  text-transform:uppercase;margin-bottom:6px;font-weight:600}
#cat-wheels .rmz-passo span{color:#4B525C;font-weight:300;font-size:13.5px;line-height:1.45}
#cat-wheels .rmz-painel{background:#0E1116;color:#fff;border:1px solid rgba(242,194,48,.5);
  border-radius:20px;padding:24px 26px 26px;box-shadow:0 26px 58px -30px rgba(14,17,22,.65)}
#cat-wheels .rmz-pt{color:var(--gold,#F2C230);font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;font-weight:500}
#cat-wheels .rmz-ph{font-size:24px;font-weight:600;margin:6px 0 12px;line-height:1.15;color:#fff}
#cat-wheels .rmz-pbox .wheels-notice{
  background:none !important;border:0 !important;border-radius:0 !important;padding:0 !important;
  margin:0 !important;max-width:none !important;width:auto !important;
  color:#AEB4BD !important;font-weight:300 !important;font-size:14px !important;line-height:1.56 !important;
  text-align:left !important;display:block !important}
#cat-wheels .rmz-pbox .wheels-notice *{color:#AEB4BD !important}
#cat-wheels .rmz-pnum{display:flex;align-items:baseline;gap:10px;margin:18px 0 2px}
#cat-wheels .rmz-pnum b{font-size:40px;font-weight:200;color:#fff;line-height:1;font-variant-numeric:tabular-nums}
#cat-wheels .rmz-pnum i{font-style:normal;color:#9AA1AC;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase}
#cat-wheels .rmz-pbtn{display:block;width:100%;margin-top:16px;background:var(--gold,#F2C230);color:#15120A;
  border:0;border-radius:12px;font-family:'Oswald',sans-serif;font-weight:600;font-size:13px;
  letter-spacing:.1em;text-transform:uppercase;padding:15px;cursor:pointer;transition:.15s}
#cat-wheels .rmz-pbtn:hover{background:#FFD24A;transform:translateY(-1px)}
#cat-wheels .rmz-pfino{color:#7D858F;font-weight:300;font-size:12px;line-height:1.5;margin-top:11px;text-align:center}

/* ---------- BANDA 2 : escura ---------- */
#cat-wheels .rmz-saber{background:#0E1116;border-bottom:3px solid var(--gold,#F2C230);padding:52px 0 58px}
#cat-wheels .rmz-cab{display:flex;align-items:center;gap:16px;margin-bottom:22px}
#cat-wheels .rmz-cab h3{font-size:12.5px;letter-spacing:.22em;text-transform:uppercase;font-weight:500;
  color:#9AA1AC;white-space:nowrap;margin:0}
#cat-wheels .rmz-ln{height:1px;background:rgba(255,255,255,.12);flex:1}
#cat-wheels details.rmz-q{border:1px solid rgba(255,255,255,.10);border-radius:14px;background:#14171D;
  margin-bottom:10px;overflow:hidden;transition:.16s}
#cat-wheels details.rmz-q[open]{border-color:rgba(242,194,48,.55);background:#171B22}
#cat-wheels details.rmz-q > summary{list-style:none;cursor:pointer;padding:17px 20px;display:flex;
  align-items:center;gap:14px;font-size:17px;font-weight:500;color:#fff}
#cat-wheels details.rmz-q > summary::-webkit-details-marker{display:none}
#cat-wheels details.rmz-q > summary::marker{content:''}
#cat-wheels .rmz-n{color:var(--gold,#F2C230);font-size:12px;letter-spacing:.18em;font-weight:500;flex:none}
#cat-wheels .rmz-qt{flex:1;min-width:0}
#cat-wheels .rmz-mais{margin-left:auto;width:28px;height:28px;border-radius:50%;
  border:1px solid rgba(242,194,48,.55);color:var(--gold,#F2C230);display:grid;place-items:center;
  font-size:16px;font-weight:300;flex:none;transition:.18s;line-height:1}
#cat-wheels details.rmz-q[open] .rmz-mais{transform:rotate(45deg);background:var(--gold,#F2C230);
  color:#15120A;border-color:var(--gold,#F2C230)}
#cat-wheels .rmz-corpo{padding:0 20px 19px 60px;color:#BAC0C9;font-weight:300;font-size:15.2px;line-height:1.68}
#cat-wheels .rmz-corpo a,#cat-wheels .rmz-corpo .xlink{color:var(--gold,#F2C230) !important;
  border-bottom:1px solid rgba(242,194,48,.45)}
#cat-wheels .rmz-tiras{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:20px}
#cat-wheels .rmz-tira{background:#171B22;border:1px solid rgba(255,255,255,.10);
  border-left:4px solid var(--gold,#F2C230);border-radius:12px;padding:15px 18px;display:flex;gap:14px;align-items:flex-start}
#cat-wheels .rmz-tira .cat-origin{background:none !important;border:0 !important;padding:0 !important;
  margin:0 !important;max-width:none !important;width:auto !important;display:flex !important;gap:14px;align-items:flex-start}
#cat-wheels .rmz-tira .co-flag{font-size:19px;line-height:1.2;flex:none}
#cat-wheels .rmz-tira .co-tx{color:#B4BAC3 !important;font-weight:300 !important;font-size:13.8px !important;line-height:1.52 !important}
#cat-wheels .rmz-tira .co-tx > b:first-of-type{color:var(--gold,#F2C230) !important;font-size:11.5px !important;
  letter-spacing:.16em !important;text-transform:uppercase !important;display:block;margin-bottom:5px;font-weight:600 !important}
#cat-wheels .rmz-tira .co-tx b{color:#fff !important}
#cat-wheels .rmz-tira .co-tx a,#cat-wheels .rmz-tira .co-tx .xlink{color:var(--gold,#F2C230) !important}
#cat-wheels .rmz-tic{font-size:19px;line-height:1.2;flex:none}
#cat-wheels .rmz-tlb{color:var(--gold,#F2C230) !important;font-size:11.5px;letter-spacing:.16em;
  text-transform:uppercase;display:block;margin-bottom:5px;font-weight:600}
#cat-wheels .rmz-tira-envio .co-ship{color:#B4BAC3 !important;font-weight:300 !important;
  font-size:13.8px !important;line-height:1.52 !important;display:block !important;margin:0 !important}

/* ---------- BANDA 3 : clara ---------- */
#cat-wheels .rmz-cartoes{background:#F3F4F6;border-bottom:3px solid var(--gold,#F2C230);padding:52px 0 56px}
#cat-wheels .rmz-h2{text-align:center;font-size:clamp(24px,3.3vw,40px);font-weight:600;font-style:italic;
  color:#15181D;margin:0 0 6px}
#cat-wheels .rmz-sub{text-align:center;color:#6A727E;font-weight:300;font-size:14.5px;margin-bottom:28px}
#cat-wheels .rmz-caixa .wh-vehbar{margin:0 0 18px}
/* a grelha dos quatro cartoes estava presa a "#wheels-app .wheels-catalog";
   como a caixa mudou de pai, repete-se aqui a mesma regra */
#cat-wheels .rmz-caixa .wheels-catalog{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:0}
@media(max-width:820px){#cat-wheels .rmz-caixa .wheels-catalog{grid-template-columns:1fr}}
/* os cartoes passam a claros, para se verem em cima do cinza */
#cat-wheels .rmz-caixa .wl-card{background:#FFFFFF !important;border:1px solid #E2E5EA !important;
  box-shadow:0 2px 12px -7px rgba(14,17,22,.3)}
#cat-wheels .rmz-caixa .wl-card:hover{border-color:var(--gold,#F2C230) !important;
  box-shadow:0 22px 44px -26px rgba(14,17,22,.5);transform:translateY(-3px)}
#cat-wheels .rmz-caixa .wl-card,
#cat-wheels .rmz-caixa .wl-card p,
#cat-wheels .rmz-caixa .wl-card li,
#cat-wheels .rmz-caixa .wl-card span:not(.wl-eye):not([class*=gold]){color:#3C434E}
#cat-wheels .rmz-caixa .wl-card h3,#cat-wheels .rmz-caixa .wl-card h4,
#cat-wheels .rmz-caixa .wl-card b,#cat-wheels .rmz-caixa .wl-card strong{color:#15181D}
#cat-wheels .rmz-caixa .wl-card a{color:#A8801A}

@media(max-width:1080px){
  #cat-wheels .rmz-g{grid-template-columns:1fr;gap:28px}
  #cat-wheels .rmz-painel{max-width:560px}
}
@media(max-width:720px){
  #cat-wheels .rmz-hero{padding:38px 0 42px;margin-top:0}
  #cat-wheels .rmz-saber{padding:38px 0 42px}
  #cat-wheels .rmz-cartoes{padding:38px 0 42px}
  #cat-wheels .rmz-tiras{grid-template-columns:1fr}
  #cat-wheels .rmz-corpo{padding-left:20px}
  #cat-wheels .rmz-passo{flex:1 1 100%}
  #cat-wheels .rmz-painel{max-width:none;padding:20px 18px 22px}
}
/* a lista antiga de paragrafos deixa de aparecer: virou acordeao */
#cat-wheels .cat-intro[style*="display: none"]{display:none !important}

/* ================= BLOCO 145 — producao em branco + filtro ao lado ========
   Desenho "A": banda BRANCA, mas cada video numa placa escura. O contraste
   vem da placa, nao do video - um video de oficina sobre branco fica lavado.
   A grelha dos modelos continua escura, com o filtro numa coluna a esquerda. */

/* ---------- 1 : a banda branca ---------- */
#cat-wheels .rmp-prova{
  background:#FFFFFF;
  border-top:3px solid var(--gold,#F2C230);
  border-bottom:3px solid var(--gold,#F2C230);
  padding:52px 0 58px;margin-top:30px}
#cat-wheels .rmp-prova .prodvid{max-width:none;margin:0;padding:0;background:none}
#cat-wheels .rmp-prova .pv-head{text-align:center !important;margin-bottom:0}
#cat-wheels .rmp-prova .pv-t{
  color:#15181D !important;text-align:center !important;
  font-size:clamp(24px,3.4vw,40px) !important;font-weight:700 !important;
  letter-spacing:.01em !important;line-height:1.05 !important;margin:0 auto !important;max-width:none !important}
#cat-wheels .rmp-prova .pv-s{
  color:#515864 !important;text-align:center !important;font-weight:300 !important;
  font-size:15.5px !important;line-height:1.6 !important;max-width:72ch !important;margin:12px auto 0 !important}
/* a linha do tempo 01 - 02 - 03 */
#cat-wheels .rmp-tl{position:relative;display:grid;gap:22px;margin:36px 0 0;align-items:center}
#cat-wheels .rmp-tl:before{content:'';position:absolute;left:9%;right:9%;top:50%;height:2px;transform:translateY(-50%);
  background:linear-gradient(90deg,transparent,#C79400 12%,#C79400 88%,transparent)}
#cat-wheels .rmp-bola{position:relative;z-index:2;justify-self:center;
  width:42px;height:42px;border-radius:50%;background:#15181D;border:2px solid #C79400;
  display:grid;place-items:center;color:var(--gold,#F2C230);font-family:'Oswald',sans-serif;
  font-size:14px;font-weight:600;box-shadow:0 8px 20px -10px rgba(14,17,22,.6)}
/* a fila dos videos: cada um numa placa escura */
#cat-wheels .rmp-prova .pv-row{margin-top:20px !important;gap:22px !important}
#cat-wheels .rmp-prova .pv-i{
  background:#101318 !important;border:1px solid #1E232C !important;border-radius:18px !important;
  padding:12px 12px 0 !important;margin:0 !important;overflow:hidden !important;
  box-shadow:0 20px 44px -24px rgba(14,17,22,.75);transition:.2s}
#cat-wheels .rmp-prova .pv-i:hover{transform:translateY(-4px);
  box-shadow:0 28px 56px -24px rgba(14,17,22,.85);border-color:#C79400 !important}
/* a placa tinha aspect-ratio fixo: a legenda ficava de fora e era cortada.
   A proporcao passa para o video, e a placa cresce para caber a legenda. */
#cat-wheels .rmp-prova .prodvid[data-fmt="h"] .pv-i,
#cat-wheels .rmp-prova .prodvid[data-fmt="v"] .pv-i{aspect-ratio:auto !important}
#cat-wheels .rmp-prova .pv-i .pv-v{border-radius:11px !important;display:block;width:100% !important;
  height:auto !important;aspect-ratio:16/9 !important;object-fit:cover !important}
#cat-wheels .rmp-prova .prodvid[data-fmt="v"] .pv-i .pv-v{aspect-ratio:9/16 !important}
#cat-wheels .rmp-prova .pv-i figcaption{
  color:#FFFFFF !important;background:none !important;
  left:auto !important;right:auto !important;bottom:auto !important;
  padding:13px 4px 15px !important;text-align:center !important;
  font-size:13px !important;font-weight:500 !important;letter-spacing:.15em !important;
  text-transform:uppercase !important;position:static !important;opacity:1 !important}
#cat-wheels .rmp-prova .pv-i .pv-play{filter:drop-shadow(0 6px 14px rgba(0,0,0,.6))}

/* o risco dourado por baixo do titulo tambem vai para o meio */
#cat-wheels .rmp-prova .pv-t::after{margin-left:auto !important;margin-right:auto !important}

/* ---------- 2 : a grelha com o filtro ao lado ---------- */
/* a seccao e branca (tema claro); a grelha precisa da sua propria banda
   escura, senao os cartoes pretos ficam a nadar no branco */
#cat-wheels #wheels-showcase[data-rmp]{
  margin-left:calc(-1 * var(--rmz-esq, 0px));
  margin-right:calc(-1 * var(--rmz-dir, 0px));
  padding:48px var(--rmz-dir,0px) 58px var(--rmz-esq,0px);
  background:#0B0C0E;
  border-bottom:3px solid var(--gold,#F2C230)}
#cat-wheels #wheels-showcase[data-rmp] .wsc-title{color:var(--gold,#F2C230) !important}
#cat-wheels #wheels-showcase[data-rmp] .wsc-sub{color:#9AA1AC !important}
#cat-wheels .wsc-head{text-align:left}
#cat-wheels .rmp-cols{display:grid;grid-template-columns:250px minmax(0,1fr);gap:26px;align-items:start;margin-top:18px}
/* O Braga (21/10/2026): "o fundo ja e preto, e ainda esse botao tambem
   esta tudo preto, esse quadro esta preto tambem. Vamos dar um contraste
   com ele com branco (...) nao e para deixar apagado os textos."
   O painel passa a cartao branco sobre a faixa escura: letras escuras,
   contagens legiveis, e a cor fica para o estado activo e para o rato. */
#cat-wheels .rmp-lado{position:sticky;top:18px;background:#FFFFFF;border:1px solid rgba(0,0,0,.10);
  border-radius:16px;padding:18px 16px 20px;box-shadow:0 26px 54px -30px rgba(0,0,0,.75);
  border-top:3px solid var(--gold,#F2C230)}
#cat-wheels .rmp-t{color:#5C6470;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  font-weight:600;margin-bottom:12px}
#cat-wheels .rmp-bus{margin-bottom:18px}
#cat-wheels .rmp-lado .rmp-bus .wsc-search{width:100% !important;max-width:none !important;margin:0 !important;
  background:#F4F5F7 !important;border:1px solid rgba(0,0,0,.14) !important;border-radius:10px !important;
  padding:11px 13px !important;color:#15181D !important;font-family:'Oswald',sans-serif !important;
  font-size:12.5px !important;font-weight:300 !important}
#cat-wheels .rmp-lado .rmp-bus .wsc-search::placeholder{color:#767D88 !important;opacity:1 !important}
#cat-wheels .rmp-lado .rmp-bus .wsc-search:focus{background:#fff !important;
  border-color:var(--gold,#F2C230) !important;box-shadow:0 0 0 3px rgba(242,194,48,.25) !important;outline:none}
#cat-wheels .rmp-fil .wsc-types{display:grid !important;gap:7px !important;margin:0 !important;justify-content:stretch !important}
/* .rmp-lado entra no selector de proposito: uma regra antiga do tema
   (body.teste-branco #wheels-showcase .wsc-chip) tambem e !important e
   ganhava o fundo quase-preto, deixando a letra escura invisivel. */
#cat-wheels .rmp-lado .rmp-fil .wsc-chip{display:flex !important;align-items:center;justify-content:space-between;gap:8px;
  width:100% !important;background:#F4F5F7 !important;border:1px solid rgba(0,0,0,.12) !important;
  border-radius:10px !important;padding:11px 14px !important;color:#15181D !important;
  font-size:12.5px !important;font-weight:500 !important;
  letter-spacing:.1em !important;text-transform:uppercase !important;
  text-align:left !important;margin:0 !important;transition:.15s}
#cat-wheels .rmp-lado .rmp-fil .wsc-chip:hover{background:#FFF8E2 !important;border-color:var(--gold,#F2C230) !important;
  color:#15181D !important}
#cat-wheels .rmp-lado .rmp-fil .wsc-chip.on{background:var(--gold,#F2C230) !important;border-color:#D9A813 !important;
  color:#15120A !important;font-weight:700 !important;box-shadow:0 8px 18px -10px rgba(242,194,48,.9) !important}
#cat-wheels .rmp-lado .rmp-n{font-style:normal;font-size:11px;opacity:1;color:#5A616C;flex:none;font-weight:400}
#cat-wheels .rmp-lado .rmp-fil .wsc-chip.on .rmp-n{color:#4A3C06}
#cat-wheels .rmp-pas{border-top:1px solid rgba(0,0,0,.12);padding-top:14px;margin-top:18px}
#cat-wheels .rmp-pl .wh-steps{display:grid !important;gap:0 !important;margin:0 !important;
  justify-content:stretch !important;text-align:left !important}
#cat-wheels .rmp-lado .rmp-pl .wh-steps span{color:#2B3038 !important;font-size:11.5px !important;
  font-weight:500 !important;
  letter-spacing:.1em !important;text-transform:uppercase !important;padding:5px 0 !important;
  background:none !important;border:0 !important}
/* as setas entre os passos nao fazem sentido numa lista de cima para baixo */
#cat-wheels .rmp-pl .wh-steps span:nth-child(even){display:none !important}
#cat-wheels .rmp-dir{min-width:0}
#cat-wheels .rmp-dir #wsc-grid{grid-template-columns:repeat(4,minmax(0,1fr)) !important}
#cat-wheels .rmp-dir #wsc-more{margin-top:22px !important;text-align:center}
/* o botao vermelho nao e da casa: passa a dourado como o resto do site */
#cat-wheels .rmp-dir .wsc-btn{background:transparent !important;border:1px solid rgba(242,194,48,.5) !important;
  color:var(--gold,#F2C230) !important;border-radius:9px !important;font-weight:600 !important;
  letter-spacing:.13em !important;transition:.15s}
#cat-wheels .rmp-dir .wsc-card:hover .wsc-btn{background:var(--gold,#F2C230) !important;
  color:#15120A !important;border-color:var(--gold,#F2C230) !important}
#cat-wheels .rmp-dir .wsc-card:hover{border-color:var(--gold,#F2C230) !important;
  box-shadow:0 22px 44px -28px rgba(242,194,48,.5)}
#cat-wheels .rmp-dir .wsc-price{color:var(--gold,#F2C230) !important}

@media(max-width:1100px){
  #cat-wheels .rmp-dir #wsc-grid{grid-template-columns:repeat(3,minmax(0,1fr)) !important}
}
@media(max-width:900px){
  #cat-wheels .rmp-cols{grid-template-columns:1fr}
  #cat-wheels .rmp-lado{position:static}
  #cat-wheels .rmp-fil .wsc-types{grid-template-columns:repeat(auto-fit,minmax(130px,1fr)) !important}
}
@media(max-width:860px){
  #cat-wheels .rmp-tl{display:none}
  #cat-wheels .rmp-prova{padding:38px 0 42px;margin-top:20px}
  #cat-wheels .rmp-prova .pv-row{gap:16px !important}
}
@media(max-width:620px){
  #cat-wheels .rmp-dir #wsc-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
}

/* ===== bloco 146 — /rims: fim da pagina ==============================
   O Braga (21/10/2026): "essas partes finais da pagina, pode retirar ela
   da pagina, que ja tem todas as informacoes necessarias para fazer a
   compra da roda". Sao as duas faixas depois da grelha de modelos:
   "Available brands" + o cartao BRANDS COMING SOON, e "Ordering custom
   rims" + os 5 passos e o aviso de venda directa. Tudo isso ja esta dito
   no "Read before you buy" e no configurador. Esconde-se so dentro do
   #cat-wheels: as mesmas classes servem as outras categorias. ==== */
#cat-wheels > .section-body > .cat-brands-title,
#cat-wheels > .section-body > .mw-list,
#cat-wheels > .section-body > .wh-order-flow{ display:none !important }
#cat-wheels > .section-body{ padding-bottom:0 !important }

/* ===== bloco 148 — /rims: o configurador por cima de tudo ==============
   Ver bloco 148 do blp.js: o modal passou para o body, por isso o z-index
   vale agora na pagina. Fica acima da barra do topo (10002), do botao de
   casa (10086) e do chat (10100), e abaixo dos portoes de idade (10120) e
   de manutencao, que tem de continuar a mandar. ==================== */
#wh-modal,#wh-garage,#wh-guide{ z-index:10110 !important }

/* ===== bloco 149 — /turbos: a seccao de cima no modelo A5 =============
   Bandas de lado a lado, com a mesma medida de goteira das jantes. Cada
   banda leva o seu proprio fundo, para nao depender do tema da seccao. */
#cat-turbos .tbz{ margin-left:calc(-1 * var(--tbz-esq,0px)); margin-right:calc(-1 * var(--tbz-dir,0px));
  position:relative }
#cat-turbos .tbz-in{ max-width:1100px; margin:0 auto; padding:0 28px }

#cat-turbos .tbz-topo{ background:#0B0C0E; padding:46px 0 34px }
/* o h2 era branco sobre branco: contraste 1:1, invisivel */
#cat-turbos .tbz-topo .eyebrow{ color:#F2C230 !important; font-size:12px; letter-spacing:.26em;
  text-transform:uppercase; font-weight:600; margin:0 0 10px }
#cat-turbos .tbz-topo .sec-title{ color:#fff !important; font-size:62px; font-weight:700;
  text-transform:uppercase; line-height:1; margin:0 }
#cat-turbos .tbz-topo .sec-count{ color:#B3BAC4 !important; font-size:13.5px; letter-spacing:.14em;
  text-transform:uppercase; margin-top:10px }

#cat-turbos .tbz-claro{ background:#F7F8F9 linear-gradient(180deg,#fff,#EDEFF2); color:#15181D;
  border-top:3px solid var(--gold,#F2C230); border-bottom:3px solid var(--gold,#F2C230);
  padding:40px 0 36px }
#cat-turbos .tbz-fluxo h3{ font-size:11.5px; letter-spacing:.24em; text-transform:uppercase;
  color:#4A515C; font-weight:600; margin:0 0 22px; text-align:center }
#cat-turbos .tbz-passos{ display:flex; align-items:stretch }
#cat-turbos .tbz-p{ flex:1; text-align:center; position:relative; padding:0 8px; min-width:0 }
#cat-turbos .tbz-bola{ width:54px; height:54px; border-radius:50%; background:#15181D;
  color:var(--gold,#F2C230); display:flex; align-items:center; justify-content:center;
  margin:0 auto 12px; border:2px solid var(--gold,#F2C230) }
#cat-turbos .tbz-bola svg{ width:28px; height:28px }
#cat-turbos .tbz-p b{ display:block; font-size:14px; font-weight:600; margin-bottom:4px; color:#15181D }
#cat-turbos .tbz-p span{ font-size:12.5px; color:#4A515C; font-weight:400; line-height:1.45; display:block }
#cat-turbos .tbz-p:not(:last-child):after{ content:''; position:absolute; top:27px;
  left:calc(50% + 36px); right:calc(-50% + 36px); height:2px;
  background:repeating-linear-gradient(90deg,#C9A227 0 7px,transparent 7px 13px) }
#cat-turbos .tbz-res{ margin:22px 0 0; text-align:center; font-size:19px; font-weight:500; color:#15181D }
#cat-turbos .tbz-res em{ font-style:normal; color:#8A6A00; font-weight:700 }
#cat-turbos .tbz-faixa{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:24px }
#cat-turbos .tbz-av{ display:flex; gap:14px; background:#15181D; color:#fff;
  border:1px solid rgba(255,255,255,.1); border-radius:14px; padding:17px 19px }
#cat-turbos .tbz-ic{ font-size:22px; line-height:1; flex:none }
#cat-turbos .tbz-av>div>b{ display:block; font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--gold,#F2C230); margin-bottom:4px }
#cat-turbos .tbz-av p{ font-size:13.5px; font-weight:300; color:#D5DAE2; line-height:1.55; margin:0 }

#cat-turbos .tbz-escuro{ background:#0B0C0E; padding:36px 0 54px }
#cat-turbos .tbz-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px }
#cat-turbos .tbz-c{ background:#13161B linear-gradient(180deg,#15181D,#101318);
  border:1px solid rgba(255,255,255,.11); border-radius:18px; padding:26px 24px 28px;
  position:relative; overflow:hidden }
#cat-turbos .tbz-c:before{ content:''; position:absolute; top:0; left:0; height:3px; width:100%;
  background:var(--gold,#F2C230) }
#cat-turbos .tbz-n{ font-size:52px; font-weight:700; color:rgba(242,194,48,.26); line-height:1; margin-bottom:6px }
#cat-turbos .tbz-c h2{ font-size:20px; font-weight:600; margin:0 0 10px; color:#fff }
#cat-turbos .tbz-c p{ font-size:15px; font-weight:300; color:#C9CFD8; line-height:1.62; margin:0 }

#cat-turbos .tbz-mar{ margin-top:46px }
#cat-turbos .tbz-marcab{ display:flex; align-items:baseline; justify-content:space-between; gap:18px;
  margin-bottom:18px; flex-wrap:wrap }
#cat-turbos .tbz-marcab h3{ margin:0; font-size:12px; letter-spacing:.26em; text-transform:uppercase;
  color:var(--gold,#F2C230); font-weight:600 }
#cat-turbos .tbz-tot{ font-size:13.5px; font-weight:300; color:#B3BAC4; margin:0 }
#cat-turbos .tbz-tot b{ color:#fff; font-weight:600; font-size:16px }
#cat-turbos .tbz-fila{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px }
#cat-turbos .tbz-lg{ background:#fff; border-radius:14px; padding:16px 16px 14px;
  display:flex; flex-direction:column; margin:0 }
#cat-turbos .tbz-lg img{ height:30px; width:auto; max-width:120px; object-fit:contain;
  margin:0 0 12px; align-self:flex-start }
#cat-turbos .tbz-lg b{ font-size:14px; color:#15181D; font-weight:600; margin-bottom:2px }
#cat-turbos .tbz-qt{ display:block; font-size:12px; color:#4A515C; font-weight:400; margin-bottom:9px }
#cat-turbos .tbz-barra{ display:block; height:6px; border-radius:99px; background:#E3E6EA;
  overflow:hidden; margin-top:auto }
#cat-turbos .tbz-barra i{ display:block; height:100%; border-radius:99px;
  background:linear-gradient(90deg,#C9A227,#F2C230) }

@media(max-width:1000px){
  #cat-turbos .tbz-fila{ grid-template-columns:repeat(3,1fr) }
  #cat-turbos .tbz-cards{ grid-template-columns:1fr }
}
@media(max-width:760px){
  #cat-turbos .tbz-topo{ padding:32px 0 24px }
  #cat-turbos .tbz-topo .sec-title{ font-size:40px }
  #cat-turbos .tbz-passos{ display:grid; grid-template-columns:1fr 1fr; gap:18px 10px }
  #cat-turbos .tbz-p:not(:last-child):after{ display:none }
  #cat-turbos .tbz-res{ font-size:16.5px }
  #cat-turbos .tbz-faixa{ grid-template-columns:1fr }
  #cat-turbos .tbz-fila{ grid-template-columns:1fr 1fr }
  #cat-turbos .tbz-marcab{ flex-direction:column; gap:6px }
}
/* o carrossel antigo das marcas sai assim que o bloco novo existe */
#cat-turbos.tbz-ok .mw-list,
#cat-turbos.tbz-ok .mw-crumb,
#cat-turbos.tbz-ok .cat-brands-title,
#cat-turbos.tbz-ok .cat-intro{ display:none !important }
/* os cartoes das marcas sao ligacoes: tem de se ver que sao clicaveis */
#cat-turbos .tbz-lg{ text-decoration:none; cursor:pointer; transition:.15s;
  border:1px solid rgba(0,0,0,.08) }
#cat-turbos .tbz-lg:hover{ transform:translateY(-2px);
  border-color:var(--ac,#F2C230); box-shadow:0 16px 34px -22px rgba(0,0,0,.9) }
#cat-turbos .tbz-lg:focus-visible{ outline:3px solid var(--ac,#F2C230); outline-offset:2px }
#cat-turbos .tbz-lg:hover .tbz-barra i{ background:var(--ac,#F2C230) }

/* "Inside a turbo": fotos reais das pecas, dentro da banda clara */
#cat-turbos .tbz-dentro{ margin-top:34px; border-top:1px solid rgba(0,0,0,.12); padding-top:26px }
#cat-turbos .tbz-dentro h3{ font-size:11.5px; letter-spacing:.24em; text-transform:uppercase;
  color:#4A515C; font-weight:600; margin:0 0 18px; text-align:center }
#cat-turbos .tbz-dgrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px }
#cat-turbos .tbz-df{ margin:0; background:#fff; border:1px solid rgba(0,0,0,.1);
  border-radius:14px; overflow:hidden; display:flex; flex-direction:column }
/* as tres fotos tem proporcoes diferentes: fixa-se a caixa para as legendas
   comecarem todas a mesma altura, sem cortar nada da imagem */
#cat-turbos .tbz-df img{ width:100%; aspect-ratio:16/10; object-fit:contain;
  display:block; background:#fff; padding:6px }
#cat-turbos .tbz-df figcaption{ padding:14px 16px 16px }
#cat-turbos .tbz-df figcaption b{ display:block; font-size:14.5px; font-weight:600;
  color:#15181D; margin-bottom:5px }
#cat-turbos .tbz-df figcaption span{ display:block; font-size:13px; font-weight:300;
  color:#3A414C; line-height:1.55 }
#cat-turbos .tbz-cred{ margin:14px 0 0; text-align:center; font-size:11.5px; color:#5C6470; font-weight:400 }
@media(max-width:860px){ #cat-turbos .tbz-dgrid{ grid-template-columns:1fr } }

/* ===== bloco 151 — paginas de marca no modelo B5 =====================
   Cartao preso a esquerda, numeros grandes em cima do texto, atalhos de
   categoria com barra proporcional. Ver bloco 151 do blp.js. ======= */
.bm-grid.bm5{ align-items:start }
.bm-grid.bm5 .bm-card{ position:sticky; top:84px }

/* numeros grandes, a abrir a coluna da direita */
.bm5-nums{ display:flex; gap:40px; flex-wrap:wrap; margin:0 0 24px }
/* O painel da marca e claro, mas a cor herdada ali e #EEE, de tema escuro:
   medido, dava 1,11:1, ou seja invisivel. Herdar nao serve e branco fixo
   tambem nao - fixa-se escuro, que e o fundo real destas paginas. */
.bm-grid.bm5 .bm5-nums b{ display:block; font-size:42px; font-weight:700; line-height:1;
  color:#15181D }
.bm-grid.bm5 .bm5-nums span{ display:block; font-size:11px; letter-spacing:.18em;
  text-transform:uppercase; font-weight:500; color:#4A515C; margin-top:4px }

/* os atalhos passam a ter barra: ve-se de relance o peso de cada categoria */
.bm-grid.bm5 .bm-chips{ display:grid; grid-template-columns:1fr 1fr; gap:10px }
.bm-grid.bm5 .bm-chip{ display:grid !important; grid-template-columns:1fr auto;
  gap:6px 12px; align-items:center; text-align:left; width:100% }
.bm-grid.bm5 .bm-chip i{ display:none }
.bm5-ba{ grid-column:1/-1; height:5px; border-radius:99px;
  background:rgba(128,128,128,.28); overflow:hidden }
.bm5-ba i{ display:block !important; height:100%; border-radius:99px;
  background:linear-gradient(90deg,#C9A227,#F2C230) }

/* botao de accao no cartao */
.bm5-cta{ display:block; width:100%; margin-top:16px; background:var(--gold,#F2C230);
  color:#15120A; border:0; border-radius:10px; padding:12px; cursor:pointer;
  font-family:'Oswald',sans-serif; font-weight:600; letter-spacing:.12em;
  text-transform:uppercase; font-size:12.5px; transition:.15s }
.bm5-cta:hover{ filter:brightness(1.06) }

/* fotos reais, so na pagina da Garrett */
.bm5-fts{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:4px }
.bm5-fts figure{ margin:0; background:#fff; border:1px solid rgba(0,0,0,.1);
  border-radius:14px; overflow:hidden }
.bm5-fts img{ width:100%; aspect-ratio:16/10; object-fit:contain; display:block;
  background:#fff; padding:6px }
.bm5-fts figcaption{ padding:12px 14px 14px }
.bm5-fts figcaption b{ display:block; font-size:14px; color:#15181D; font-weight:600; margin-bottom:4px }
.bm5-fts figcaption span{ display:block; font-size:12.5px; color:#3A414C; font-weight:300; line-height:1.5 }
.bm-grid.bm5 .bm5-cred{ margin:12px 0 0; font-size:11.5px; color:#5C6470; font-weight:400 }

@media(max-width:900px){
  .bm-grid.bm5 .bm-card{ position:static }
  .bm-grid.bm5 .bm-chips{ grid-template-columns:1fr }
  .bm5-nums{ gap:28px }
  .bm5-nums b{ font-size:32px }
  .bm5-fts{ grid-template-columns:1fr }
}
/* o numero do atalho vinha a #C79400 sobre branco: 2,74:1, abaixo do minimo
   legivel de 4,5:1. Escurece-se o suficiente para passar sem deixar de ser dourado */
.bm-grid.bm5 .bm-chip b{ color:#8A6A00 }
.bm-grid.bm5 .bm-chip em{ color:#15181D }

/* ===== bloco 152 — legibilidade, varrimento do site ==================
   Medido fotografando cada texto e comparando os pixeis do texto com os do
   fundo, nao pelo CSS: assim nao se confunde dourado sobre carbono (que se
   le bem) com dourado sobre branco (que nao se le). Minimo exigido 4,5:1.
   ================================================================== */

/* /rims — dourado da marca sobre cartao branco: media 1,49:1 a 1,67:1.
   Escurece-se o dourado o suficiente para passar, mantendo-o dourado. */
#cat-wheels .rmz-caixa .wl-card .wl-kicker{ color:#8A6A00 }
#cat-wheels .rmz-caixa .wl-card .wl-cta{ color:#8A6A00 }
/* subtitulo da banda clara: 3,26:1 */
#cat-wheels .rmz-sub{ color:#4A515C }
/* passos "01 · Spec": 3,48:1 */
#cat-wheels .rmz-passos .rmz-passo b{ color:#7A5D00 }

/* contagem de produtos, pastilha escura com texto esbatido: 3,64:1 */
.prod-filter .filter-count{ color:#F0D98A }

/* ligacoes dentro dos cartoes dos turbos: 3,79:1 sobre o cartao escuro */
#cat-turbos .tbz-c p a.xlink,
#cat-turbos .tbz-c a.xlink{ color:var(--gold,#F2C230) !important }

/* rotulos pequenos esbatidos sobre fundo escuro nos body kits: 3,92:1 */
#cat-bodykits .bkd-topo small,
#cat-bodykits .bkd-num small{ color:#E8C96A }
/* o rotulo "PARTS" nos botoes de segmento dos body kits: #7D858F sobre
   fundo quase preto da 3,92:1 */
#cat-bodykits .bks-dir > span{ color:#A9B1BC !important }

/* ==================================================================
   BLOCO 153 (CSS) — 22/10/2026 — leitura, segunda passagem
   Medido com a cor declarada contra o pixel de fundo que mais se
   repete dentro do proprio elemento, em 1440, 820 e 390 de largura.
   So entram aqui os casos abaixo de 4,5:1 (3:1 no texto grande).
   ================================================================== */

/* /performance — as etiquetas dos cartoes usavam a cor do grupo tanto
   para o texto como para o fundo esbatido: dourado sobre creme dava
   2,32:1 e o verde-agua 2,67:1. Guarda-se a cor do grupo para a barra
   lateral e o icone (que e onde ela se ve) e cria-se uma variante so
   para texto, escura o suficiente para se ler. */
#cat-performance .plq-op{ --act:#B01212 }
#cat-performance .plq-op[data-g="handling"]{ --act:#07706D }
#cat-performance .plq-op[data-g="power"]{ --act:#7A5C00 }
#cat-performance .plq-op .plq-tags span{ color:var(--act) }
#cat-performance .plq-op .plq-mk{ color:var(--act) }

/* legenda e percentagens sobre o painel escuro: 4,09:1 e 4,42:1 */
#cat-performance .plq-leg{ color:#868F9C }
#cat-performance .perfsub-chip .plq-pc{ color:#8B94A1 }

/* base de saber do Expert Guide: dourado da marca sobre cartao
   branco, 1,63:1. Mesmo dourado escurecido usado no resto do site. */
#guia-saber .gs-eyebrow{ color:#8A6A00 }

/* ==================================================================
   BLOCO 154 (CSS) — 22/10/2026 — leitura, terceira passagem
   Paginas fora das tres principais. Tudo medido com a cor declarada
   contra o pixel de fundo dominante do proprio elemento.

   Nota importante: os titulos brancos de /about, /tej e /formulaz
   NAO foram mexidos. Pareciam branco sobre branco na medicao, mas por
   tras deles ha um video; no teste ele nao chegou a carregar e deixou
   a faixa clara. A propria folha ja diz isto: a classe .tem-faixa-video
   e que manda o titulo ser branco e o sobretitulo ficar dourado cheio.
   Em vez de estragar a cor do titulo, da-se a faixa e ao video um fundo
   escuro de reserva: enquanto o video corre nada muda, e se ele falhar
   (ligacao lenta, video em falta) o titulo continua a ler-se.
   Quem vier a seguir: NAO escurecer os titulos nem os sobretitulos de
   .tem-faixa-video. Eles estao certos.
   ================================================================== */
.tem-faixa-video .tit-video,
.tem-faixa-video .tit-video video,
#about video, #cat-tej video, #fz-topo video, #ak-corpo video,
#fz-topo .fzv-v, #fz-topo .fz-banner, #ak-corpo .akv-foto{ background-color:#0D0E10 }

/* /tej — a citacao em destaque: cinzento claro sobre painel quase
   branco, 1,41:1. Era texto pensado para fundo escuro. */
#cat-tej > .section-body > .tejp-rule,
#cat-tej > .section-body > .tejp-rule strong{ color:#3C434E }
/* botao de contorno e sobretitulo, dourado sobre branco: 1,63:1 */
#cat-tej > .section-body > .tejp-acts > .tejp-btn.ghost{ color:#8A6A00 }
#cat-tej > .section-body > .eyebrow{ color:#8A6A00 }
/* dentro dos cartoes escuros do /tej o dourado escuro fica a 3,62:1:
   aqui vai o dourado cheio, que e o certo sobre fundo escuro */
#cat-tej .tejp-card a.xlink{ color:var(--yellow,#F2C230) !important }

/* /others — "19 parts" cinzento escuro sobre mosaico escuro: 2,28:1 */
#others-makes .veh-tile .veh-cnt{ color:#7F8795 }

/* /formulaz e /about — sobretitulos e "read more" dourados sobre branco */
#cat-formulaz .ak-wrap .ex-h{ color:#8A6A00 }
#fz-topo .fzv-corpo .mobtext-toggle{ color:#8A6A00 }
#about .about-text .mobtext-toggle{ color:#8A6A00 }
#about > .section-body > .eyebrow{ color:#8A6A00 }

/* /akrapovic — com a faixa escura garantida acima, o sobretitulo pode
   subir de 3,94:1 para 5,4:1 sem deixar de ser dourado */
#ak-corpo .akv-corpo .mobtext-toggle{ color:#8A6A00 }
html body.teste-branco #cat-akrapovic .akv-olho{ color:#A8821A !important }

/* /news — titulo com ligacao sobre faixa escura: 3,68:1 */
#news-carousel .nv-tx a.xlink{ color:var(--yellow,#F2C230) !important }

/* ficha das paginas de marca (todas, nao so a Garrett): o numero
   dourado dava 2,32:1 e o rotulo 3,80:1 sobre o cartao branco */
.brand-page .bm-ficha .v.g{ color:#7A5C00 }
.brand-page .bm-ficha .k{ color:#5A616C }

/* botao do Instagram: branco sobre o degrade da marca chega a 4,09:1
   na ponta laranja. Escurece-se o degrade o minimo para passar,
   mantendo a leitura roxo -> rosa -> laranja. */
.sp-ig-btn{ background:linear-gradient(135deg,#7A2FA6,#C9245A,#B85618) }

/* "Loading products…" cinzento claro sobre branco: 3,06:1. Aparece
   so um instante, mas e a primeira coisa que o cliente le. */
.blpcat-load{ color:#5A616C }
/* (a cor vinha de um estilo em linha no blp.js; foi corrigida la tambem) */

/* ==================================================================
   BLOCO 155 (CSS) — 22/10/2026 — o carrinho
   O tema claro deixou o painel do carrinho branco (ver a lista grande
   do body.teste-branco mais acima), mas as cores das letras ficaram as
   do tema escuro. Resultado: o total, o IVA, os portes, o subtotal e
   o "Your cart is empty" ficaram entre 1,41:1 e 2,38:1 — ou seja,
   praticamente invisiveis, logo na pagina onde se paga.
   A faixa dos titulos da tabela continua escura, por isso ai a letra
   vai ao contrario: mais clara, nao mais escura.
   ================================================================== */

/* faixa escura: titulos das colunas e carrinho vazio (2,28:1) */
body.teste-branco #cat-cart .cart-full-head,
body.teste-branco #cat-cart .cart-empty{ color:#9AA2AE }

/* caixa clara do resumo: linhas, notas e portes (1,45:1 a 2,38:1) */
body.teste-branco #cat-cart .cart-sum-line,
body.teste-branco #cat-cart .cart-sum-note,
body.teste-branco #cat-cart #cart-sum-ship-v{ color:#4A515C }
body.teste-branco #cat-cart .cart-sum-total{ color:#15181D }

/* o total em destaque: dourado da marca sobre creme dava 1,41:1 */
body.teste-branco #cat-cart .cart-sum-total strong,
body.teste-branco #cat-cart #cart-full-total{ color:#7A5C00 }

/* "Continue shopping": botao de contorno, letra branca sobre claro */
body.teste-branco #cat-cart .cart-btn-view.ghost{ color:#15181D }
body.teste-branco #cat-cart .cart-btn-view.ghost:hover{ color:#7A5C00 }

/* ==================================================================
   BLOCO 156 (CSS) — 22/10/2026 — a caixa da estimativa de portes
   Com uma peca no carrinho aparece a caixa do peso e da embalagem.
   As cores dela sao injetadas por um <style> que o blp.js cria, e esse
   <style> entra no fim do <head>, por isso ganha a esta folha quando a
   forca e igual. Por isso aqui usa-se o id da caixa, que vence.
   No tema claro essa caixa fica creme e as letras eram as do tema
   escuro: o peso, a caixa sugerida e o aviso da palete liam-se a
   1,20:1. Numa pagina de pagamento isso nao pode ficar assim.
   Fora do carrinho a caixa nao e tocada: ai continua sobre fundo
   escuro e as cores claras estao certas.
   ================================================================== */
body.teste-branco #cat-cart #blp-peso-box .bp-h,
body.teste-branco #cat-cart #blp-peso-box .bp-frete span,
body.teste-branco #cat-cart #blp-peso-box .bp-frete b{ color:#7A5C00 }
body.teste-branco #cat-cart #blp-peso-box .bp-l{ color:#4A515C }
body.teste-branco #cat-cart #blp-peso-box .bp-l b{ color:#15181D }
/* bloco 232 — as linhas novas (de onde sai cada tipo de peca) tambem
   precisam de ler bem no carrinho claro: estavam escritas para fundo
   escuro e quase nao se viam. */
body.teste-branco #cat-cart #blp-peso-box .bp-org{ color:#4A515C }
body.teste-branco #cat-cart #blp-peso-box .bp-org b{ color:#15181D }
body.teste-branco #cat-cart #blp-peso-box .bp-org:before{ color:#7A5C00 }
body.teste-branco #cat-cart #blp-peso-box .bp-n,
body.teste-branco #cat-cart #blp-peso-box .bp-av{ color:#4A515C }
body.teste-branco #cat-cart #blp-peso-box{ border-color:#D8DCE3 }

/* A linha dos portes e escrita pelo blp.js com a cor no proprio
   elemento, que nenhuma folha consegue vencer sem !important. A cor
   foi corrigida la; isto aqui e so a rede de seguranca para quem ainda
   tiver o ficheiro antigo em cache. */
body.teste-branco #cat-cart #cart-sum-ship-l,
body.teste-branco #cat-cart .cart-sum-line span{ color:#4A515C !important }
body.teste-branco #cat-cart #cart-sum-ship-v[style*="9aa0aa"]{ color:#4A515C !important }

/* ==================================================================
   BLOCO 157 (CSS) — 22/10/2026 — o resto do resumo do carrinho
   Tres linhas que ficaram de fora do bloco anterior porque so
   aparecem quando ha mesmo uma peca no carrinho.
   ================================================================== */
/* "Pick your country at checkout to see the shipping price" */
body.teste-branco #cat-cart #blp-peso-box .blp-frete,
body.teste-branco #cat-cart #blp-peso-box .bf-w{ color:#4A515C }
/* "1 shipment · to calculate" — cinzento claro sobre o painel creme */
body.teste-branco #cat-cart #cart-ship-rules .ship-rule{ color:#4A515C }
/* as etiquetas do grupo (Turbos, Body Kits, Wheels...): a cor do grupo
   fica no fundo da etiqueta, que e o que a distingue; a letra passa a
   escura, porque verde sobre verde claro dava 1,36:1 e dourado sobre
   creme 1,13:1. */
body.teste-branco #cat-cart #cart-ship-rules .sr-tag{ color:#15181D }
/* o preco unitario pequeno, por baixo do nome da peca: cinzento escuro
   sobre o painel escuro da tabela, 2,28:1 (so se via no telemovel). */
body.teste-branco #cat-cart .cart-full-row .cart-mini-price{ color:#9AA2AE }

/* ==================================================================
   BLOCO 158 (CSS) — 22/10/2026 — o botao "View full catalog"
   O tema claro poe letra quase preta em todos os .brand-cta, mas o
   fundo desse botao continua a ser o vermelho da marca. Preto sobre
   vermelho da 3,59:1. Branco sobre o mesmo vermelho da 5,27:1 — e e
   alias a cor que o botao ja tinha antes do tema claro.
   Os botoes "Voltar" partilham a mesma classe mas trazem
   background:transparent escrito no proprio elemento e assentam na
   pagina clara, por isso esses ficam com letra escura, como estavam.
   A Akrapovic tem regra propria com id, por isso nao e afetada.
   ================================================================== */
html body.teste-branco a.brand-cta:not([style*="transparent"]){ color:#FFFFFF !important }

/* Se a fotografia do topo da Akrapovic nao chegar a carregar, a moldura
   fica com altura zero e o sobretitulo, que esta encostado ao fundo
   dela, cai em cima da pagina branca — dourado sobre branco, ilegivel.
   Uma altura minima resolve: com a foto carregada ela e sempre mais
   alta do que isto, por isso nada muda; sem foto fica a faixa escura
   do degrade e o texto continua a ler-se. */
#cat-akrapovic .akv-foto{ min-height:160px }

/* ==================================================================
   BLOCO 161 (CSS) — 22/10/2026 — telemovel: centrar o que ficou torto
   O Braga, pontos 3 e 4 da lista: no telemovel o titulo do topo dos
   body kits e os botoes das categorias ficavam encostados a esquerda.
   Em ecra estreito tudo isto empilha numa coluna so, por isso centrado
   le-se melhor e fica direito com o resto da pagina.
   ================================================================== */
@media(max-width:860px){
  /* 3 — titulo e texto do topo dos body kits */
  #cat-bodykits .bkd-topo{ text-align:center }
  #cat-bodykits .bkd-topo .bkd-num,
  #cat-bodykits .bkd-topo .bkd-tx,
  #cat-bodykits .bkd-topo .bkd-tx b,
  #cat-bodykits .bkd-topo .bkd-num small{ text-align:center }
  #cat-bodykits .bkd-topo .bkd-num{ justify-items:center }

  /* 4 — os botoes "All body kits", "Blacklist" e "Auto-R" */
  #cat-bodykits .bk-seg-toggle .bk-seg{ text-align:center; justify-items:center }
  #cat-bodykits .bk-seg-toggle .bk-seg .bks-tx,
  #cat-bodykits .bk-seg-toggle .bk-seg .bks-tx b,
  #cat-bodykits .bk-seg-toggle .bk-seg .bks-tx small{ text-align:center }
  #cat-bodykits .bk-seg-toggle .bk-seg .bks-dir{ text-align:center !important }
}

/* ==================================================================
   BLOCO 162 (CSS) — 22/10/2026 — telemovel: as noticias (pontos 20 e 21)
   Centram-se os cartoes, os titulos, a linha da data e os botoes.
   O CORPO do artigo fica alinhado a esquerda de proposito: texto
   corrido centrado e cansativo de ler, e sao varios paragrafos.
   ================================================================== */
@media(max-width:860px){
  #cat-news .news-card,
  #cat-news .nv-tx,
  #cat-news .nc-body,
  #cat-news .nc-title,
  #cat-news .nc-meta,
  #cat-news .nv-c{ text-align:center }
  #cat-news .nc-body > *{ margin-left:auto; margin-right:auto }

  /* cabecalho do artigo: titulo, data, tempo de leitura e o botao voltar */
  html body .art-wrap{ text-align:center }
  html body .art-wrap h1,
  html body .art-wrap h2,
  html body .art-wrap .art-meta,
  html body .art-wrap .eyebrow,
  html body .art-share{ text-align:center }
  html body .art-wrap .art-body{ text-align:left }
  html body .art-share{ justify-content:center }
}

/* ==================================================================
   BLOCO 164 (CSS) — 22/10/2026 — o header no telemovel (pontos 6 e 26)
   Os botoes da direita (conta, a setinha da conta, carrinho, sino)
   estavam colados uns aos outros, com 6 a 8px entre eles, e a setinha
   quase nao se acertava com o dedo. Da-se-lhes folga e garante-se que
   cada um tem pelo menos 44px de area de toque, que e o minimo para o
   dedo acertar a primeira.
   ================================================================== */
@media(max-width:1024px){
  html body .hdr-actions{ gap:12px !important; right:12px !important }
  html body .hdr-actions > *{ min-width:44px; min-height:44px }
  html body .hdr-actions > a,
  html body .hdr-actions > button{ display:flex; align-items:center; justify-content:center }
  /* a setinha que abre a conta era a mais estreita de todas */
  html body .hdr-actions .acct-caret,
  html body .hdr-actions [class*="caret"],
  html body .hdr-actions [class*="chev"]{ min-width:38px; padding-left:6px; padding-right:6px }
}
@media(max-width:420px){
  html body .hdr-actions{ gap:10px !important; right:10px !important }
}

/* ==================================================================
   BLOCO 168 (CSS) — 22/10/2026 — o botao da musica (ponto 18)
   O circulo passa a ser dourado cheio com o equalizador recortado por
   dentro, em vez de um contorno com uma nota que nem sempre existe no
   tipo de letra. Ganha tambem a legenda "now playing" por baixo, que e
   o que diz a pessoa que ali ha musica a tocar.
   ================================================================== */
#capa .music-chip .n{
  background:var(--yellow,#F2C230) !important;
  border-color:var(--yellow,#F2C230) !important;
  width:30px !important; height:30px !important; padding:0;
  overflow:hidden; flex:none
}
#capa .music-chip .n svg{ width:17px; height:17px; display:block; fill:#15181D; stroke:none }
#capa .music-chip:hover .n{ background:#fff !important; border-color:#fff !important }
#capa .music-chip:hover .n svg{ fill:#15181D }
#capa .music-chip b{ line-height:1.15 }
#capa .music-chip b::after{
  content:'Now playing'; display:block; font-size:9.5px; letter-spacing:.14em;
  color:#9AA2AE; text-transform:uppercase; font-weight:400; margin-top:1px
}
#capa .music-chip:hover b::after{ color:#3C434E }
@media(max-width:520px){
  #capa .music-chip .n{ width:28px !important; height:28px !important }
  #capa .music-chip .n svg{ width:16px; height:16px }
}

/* ==================================================================
   BLOCO 169 (CSS) — 22/10/2026 — os projetos no telemovel (ponto 28)
   Aprovada a proposta B, "lista de garagem".
   O que estava: uma grelha de duas colunas de 128px num ecra de 390 —
   cartoes minusculos, com o nome do carro escrito POR CIMA da foto, a
   tapar o carro, e dois quadrados vazios "your car here" lado a lado.
   O que passa a estar: uma linha por build, miniatura quadrada a
   esquerda e o texto a direita, onde se le. A foto fica limpa. Um unico
   convite para entrar no mural, a toda a largura, no fim da lista.
   Em ecra grande nao se mexe: continua a grelha de sempre.
   ================================================================== */
@media(max-width:860px){
  html body #projects .prj-carrossel .prj-grid,
  html body #projects .prj-carrossel.modo-destaque .prj-grid{
    display:grid !important; grid-template-columns:1fr !important; gap:9px !important }

  html body #projects .prj-carrossel .prj-grid .prj-card{
    display:grid !important; grid-template-columns:92px 1fr !important;
    align-items:stretch; min-height:78px; padding:0 !important;
    border:1px solid #E2E5EA; border-radius:12px; overflow:hidden;
    background:#fff; box-shadow:none }

  html body #projects .prj-carrossel .prj-grid .prj-card .prj-img{
    position:relative !important; inset:auto !important;
    width:92px !important; max-width:92px !important; height:auto !important;
    min-height:78px; aspect-ratio:1/1;
    margin:0 !important; border-radius:0 !important; overflow:hidden; background:#1C2029 }
  html body #projects .prj-carrossel .prj-grid .prj-card .prj-img img{
    width:100%; height:100%; object-fit:cover; display:block }
  /* o veu escuro existia para o texto se ler por cima da foto; agora o
     texto esta fora da foto, por isso o veu so a escurecia a toa */
  html body #projects .prj-carrossel .prj-grid .prj-card .prj-img-ov{ display:none !important }

  html body #projects .prj-carrossel .prj-grid .prj-card .prj-info{
    position:static !important; inset:auto !important; width:auto !important;
    height:auto !important; transform:none !important; padding:11px 12px !important;
    display:flex; flex-direction:column; justify-content:center; min-width:0;
    background:transparent !important }
  html body #projects .prj-carrossel .prj-grid .prj-card .prj-eyebrow{
    font:500 10px Oswald,sans-serif !important; letter-spacing:.16em; text-transform:uppercase;
    color:#8A6A00 !important; margin:0 0 3px !important }
  html body #projects .prj-carrossel .prj-grid .prj-card h3{
    margin:0 !important; font:600 15px/1.22 Oswald,sans-serif !important;
    color:#15181D !important; text-shadow:none !important;
    overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical }
  html body #projects .prj-carrossel .prj-grid .prj-card .prj-meta-row{ margin:4px 0 0 !important }
  html body #projects .prj-carrossel .prj-grid .prj-card .prj-by{
    font:400 11.5px Oswald,sans-serif !important; color:#6B727E !important }

  /* o "View ›" vira uma setinha discreta encostada a direita */
  html body #projects .prj-carrossel .prj-grid .prj-card .prj-go{
    position:absolute !important; right:10px; top:50%; transform:translateY(-50%);
    font-size:0 !important; color:#8A919B !important; background:none !important;
    border:0 !important; padding:0 !important }
  html body #projects .prj-carrossel .prj-grid .prj-card .prj-go svg{ width:17px; height:17px; display:block }
  html body #projects .prj-carrossel .prj-grid .prj-card{ position:relative }
  html body #projects .prj-carrossel .prj-grid .prj-card .prj-info{ padding-right:30px !important }

  /* um so convite, a toda a largura */
  html body #projects .prj-carrossel .prj-grid .prj-add-btn,
  html body #projects .prj-carrossel.modo-destaque .prj-grid .prj-add-btn{
    grid-column:1 / -1; display:flex; flex-direction:column; align-items:center;
    justify-content:center; text-align:center; gap:3px;
    min-height:96px; padding:18px 14px !important;
    border:1.5px dashed #D3D8E0 !important; border-radius:12px;
    background:#FAFBFC !important; color:#15181D !important }
  html body #projects .prj-carrossel .prj-grid .prj-add-btn *{ color:#15181D !important }
  html body #projects .prj-carrossel .prj-grid .prj-add-btn ~ .prj-add-btn{ display:none !important }
}

/* ==================================================================
   BLOCO 170 (CSS) — 22/10/2026 — Expert Guide por dentro (pontos 22-24)
   Aprovada a proposta C, "escada". O Braga pediu o mesmo estilo em TUDO
   o que se abre dentro do Expert Guide no telemovel, nao so no Stage.

   O que estava mal: no tema claro o painel ficava creme mas as letras
   continuavam as do tema escuro — cinzento muito claro sobre creme. Era
   isso o "apagado". Os titulos das seccoes eram dourado cheio sobre
   claro, que tambem nao se le.

   O estilo aprovado: cabecalho escuro com sobretitulo dourado, corpo
   branco, cada ponto numa linha com um numero dourado a frente, e os
   avisos numa caixa de contorno dourado.
   ================================================================== */
@media(max-width:860px){
  /* cabecalho: fica escuro sempre, e o contraste do titulo */
  html body #guia-saber .gs-painel{
    background:#fff !important; border:1px solid #E2E5EA !important; overflow:hidden }
  html body #guia-saber .gs-p-cab{
    background:#0E1116 !important; border-bottom:0 !important; padding:16px 15px 14px !important }
  html body #guia-saber .gs-p-grupo{ color:#F2C230 !important }
  html body #guia-saber .gs-p-cab h4{ color:#fff !important; font-size:21px !important }
  html body #guia-saber .gs-p-cab p{ color:#C9CFD8 !important }
  html body #guia-saber .gs-fechar{
    border-color:rgba(255,255,255,.3) !important; color:#fff !important }

  /* corpo branco, cada ponto numerado */
  html body #guia-saber .gs-p-corpo{ padding:4px 15px 8px !important; background:#fff }
  html body #guia-saber .gs-sec{ border-bottom:1px solid #EDEFF3 !important; padding:14px 0 !important }
  html body #guia-saber .gs-sec h5{
    color:#15181D !important; font-size:15.5px !important; font-weight:600;
    display:flex; align-items:center; gap:8px; margin:0 0 9px !important }
  html body #guia-saber .gs-sec h5::before{
    content:''; width:4px; height:15px; border-radius:2px; background:#F2C230; flex:none }

  html body #guia-saber .gs-sec ul{
    counter-reset:gsn; padding:0 !important; margin:0 !important; list-style:none !important }
  html body #guia-saber .gs-sec li{
    counter-increment:gsn; position:relative; list-style:none;
    padding:0 0 0 30px !important; margin:0 0 10px !important;
    color:#3C434E !important; font-size:13.8px !important; line-height:1.62 !important }
  html body #guia-saber .gs-sec li::before{
    content:counter(gsn); position:absolute; left:0; top:1px;
    width:21px; height:21px; border-radius:6px; background:#F2C230; color:#15181D;
    font:700 11px/21px Oswald,sans-serif; text-align:center }

  /* o rodape do painel e o botao */
  html body #guia-saber .gs-p-pe{
    background:#F7F8F9; border-top:1px solid #E2E5EA !important; padding:13px 15px 15px !important }
  html body #guia-saber .gs-p-pe > span{ color:#4A515C !important }
  html body #guia-saber .gs-ver{ background:#15181D !important; color:#F2C230 !important }

  /* o aviso solto dentro do guia passa a caixa de contorno dourado */
  html body #guia-saber .gs-aviso{
    background:#FFFCF2 !important; border:1px solid #E6CF84 !important;
    border-left:4px solid #C79400 !important; border-radius:10px;
    color:#3C434E !important; padding:12px 13px !important }

  /* o topo da base de saber, na mesma linguagem */
  html body #guia-saber .gs-cab h4{ color:#15181D !important }
  html body #guia-saber .gs-cab p{ color:#4A515C !important }
}

/* O convite "Your car here" e um .prj-card.prj-vazio, nao o .prj-add-btn.
   Como herdou as regras do cartao da lista, ficou com letra escura sobre
   o fundo escuro dele. Aqui fica como estava desenhado na proposta: uma
   caixa clara de contorno tracejado, a toda a largura, uma so vez. */
@media(max-width:860px){
  html body #projects .prj-carrossel .prj-grid .prj-card.prj-vazio{
    display:flex !important; flex-direction:column; align-items:center; justify-content:center;
    text-align:center; gap:3px; min-height:96px; padding:18px 14px !important;
    background:#FAFBFC !important; background-image:none !important;
    border:1.5px dashed #D3D8E0 !important; border-radius:12px !important }
  html body #projects .prj-carrossel .prj-grid .prj-card.prj-vazio .prj-img,
  html body #projects .prj-carrossel .prj-grid .prj-card.prj-vazio .prj-go{ display:none !important }
  html body #projects .prj-carrossel .prj-grid .prj-card.prj-vazio .prj-info{
    padding:0 !important; align-items:center; text-align:center }
  html body #projects .prj-carrossel .prj-grid .prj-card.prj-vazio h3{
    font-size:14px !important; color:#15181D !important; -webkit-line-clamp:2 }
  html body #projects .prj-carrossel .prj-grid .prj-card.prj-vazio .prj-eyebrow,
  html body #projects .prj-carrossel .prj-grid .prj-card.prj-vazio .prj-by{
    color:#6B727E !important }
  /* so o primeiro convite; os outros quadrados vazios desaparecem */
  html body #projects .prj-carrossel .prj-grid .prj-card.prj-vazio ~ .prj-card.prj-vazio{
    display:none !important }
}
/* O botao vermelho do convite dos projetos: branco sobre #F43434 da
   3,90:1. Escurece-se o vermelho o minimo para passar os 4,5:1, sem
   deixar de ser o vermelho de aviso da marca. */
#prj-convite-ov .prj-convite-modal button{ background:#D01C1C !important }

/* ==================================================================
   BLOCO 171 (CSS) — 22/10/2026 — os icones do /performance (ponto 2)
   Aprovado o estilo "oficina" com o jogo 2, "instrumentos": cronometro
   de volta, volante e manometro de pressao. Saem os emojis 🏁 🔄 💥.
   O quadrado passa a escuro, com traco fino na cor do grupo — e assim
   os tres ficam irmaos, do mesmo diametro, como num painel de carro.
   ================================================================== */
#cat-performance .plq-op .plq-ico{
  background:#0E1116 !important;
  border:1px solid rgba(255,255,255,.14) !important;
  border-radius:10px;
  width:46px; height:46px; padding:0; overflow:hidden }
#cat-performance .plq-op .plq-ico .plq-sv{
  width:27px; height:27px; display:block;
  fill:none; stroke:var(--ac,#D21F1F); stroke-width:1.4;
  stroke-linecap:round; stroke-linejoin:round }
/* quando o cartao esta escolhido, o quadrado acende na cor do grupo */
#cat-performance .plq-op.on .plq-ico{
  background:var(--ac,#D21F1F) !important; border-color:var(--ac,#D21F1F) !important }
#cat-performance .plq-op.on .plq-ico .plq-sv{ stroke:#0E1116 }
@media(max-width:860px){
  #cat-performance .plq-op .plq-ico{ width:42px; height:42px }
  #cat-performance .plq-op .plq-ico .plq-sv{ width:25px; height:25px }
}
/* O vermelho da marca sobre o quadrado quase preto do icone da "Track
   days" da 2,6:1 — pouco para uma forma desenhada, que precisa de 3:1.
   So o TRACO do icone sobe de tom; a barra lateral e as pastilhas do
   cartao ficam no vermelho de sempre. */
#cat-performance .plq-op:not([data-g="handling"]):not([data-g="power"]) .plq-ico .plq-sv{
  stroke:#E8453F }
#cat-performance .plq-op.on .plq-ico .plq-sv{ stroke:#0E1116 }

/* ==================================================================
   BLOCO 172 (CSS) — 22/10/2026 — a janela de configurar o escape
   (pontos 13 e 14)
   O Braga: "muita coisa sobre a outra, ainda ta com fundo aparecendo,
   a tela toda bagunçada, olha em cima".

   Duas causas, as duas reais:
   1) A ".age-card" — a moldura desta janela e de varias outras — NUNCA
      teve fundo nenhum definido na folha. So tinha medidas. Por isso a
      pagina de tras aparecia por entre os campos do formulario, e lia-se
      "Supercar", "Lamborghini, Ferrari" e as pastilhas por baixo do
      texto da configuracao. (A irma ".age-modal" tem fundo; esta ficou
      sem ele.)
   2) Os botoes flutuantes (MENU, BACK, carrinho, sino) ficam por cima de
      tudo e caiam exactamente em cima do titulo da janela.
   ================================================================== */
.age-card{
  width:100%;
  background:linear-gradient(180deg,#14171D,#0B0D11) !important;
  border:1px solid rgba(242,194,48,.30);
  border-radius:16px;
  padding:26px 24px;
  box-shadow:0 34px 90px -28px rgba(0,0,0,.95);
  color:#E6E9EF;
  max-height:calc(100vh - 40px);
  overflow-y:auto; -webkit-overflow-scrolling:touch }

/* enquanto uma destas janelas esta aberta, os botoes flutuantes saem da
   frente — senao sentam-se em cima do titulo */
body:has(.auth-ov.on) .navbtns,
body:has(.auth-ov.on) .hdr-actions,
body:has(.age-ov.on) .navbtns,
body:has(.age-ov.on) .hdr-actions{ display:none !important }

/* a janela fica acima de tudo o resto */
.auth-ov{ z-index:10120 !important }

@media(max-width:860px){
  .auth-ov{ padding:12px !important; align-items:flex-start !important }
  .auth-ov .age-card{
    padding:20px 16px 22px !important;
    margin:0 auto !important;
    max-height:calc(100vh - 24px) }
  /* o X de fechar com area de toque a serio */
  .auth-ov .age-card > button[onclick]{
    top:8px !important; right:8px !important;
    width:40px; height:40px; display:flex; align-items:center; justify-content:center;
    color:#C9CFD8 !important; font-size:26px !important }
}
/* rede de seguranca do bloco 173, para quem nao tem :has() */
body.blp-ov-aberto .navbtns,
body.blp-ov-aberto .hdr-actions{ display:none !important }
/* o X fica no canto; o cabecalho da janela tem de lhe dar lugar */
#exreq-ov .exreq-brandhead,
.auth-ov .age-card > div:first-of-type{ padding-right:44px }

/* ==================================================================
   BLOCO 176 (CSS) — 22/10/2026 — a sirene da Blacklist (ponto 27)
   A chapa deixa de flutuar por cima da faixa do video e passa a ocupar
   o seu proprio lugar: centrada, entre o banner que corre e a frase
   "The Blacklist · Top Speed Board". Nao tapa nada porque ja nao esta
   por cima de nada.
   A luz fica maior e com brilho, a trocar de vermelho para azul como a
   de um carro de policia, e as cinco estrelas ficam todas.
   ================================================================== */
#cat-blacklist .blw.blw-fluxo{
  position:static !important; transform:none !important;
  display:flex; align-items:center; justify-content:center; gap:12px;
  width:max-content; max-width:calc(100% - 24px);
  margin:14px auto 16px !important;
  padding:9px 18px !important;
  border-radius:999px;
  background:rgba(4,5,7,.80) !important;
  border:2px solid rgba(242,194,48,.5) !important;
  pointer-events:none }

/* a luz: duas metades que acendem a vez, com halo, como uma sirene */
#cat-blacklist .blw.blw-fluxo .blw-rot{
  display:block !important; width:42px !important; height:15px !important;
  border-radius:5px; overflow:hidden; background:#06070a;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.12) }
#cat-blacklist .blw.blw-fluxo .blw-rot i{ filter:saturate(1.3) }
#cat-blacklist .blw.blw-fluxo .blw-rot i:nth-child(1){
  box-shadow:0 0 14px 3px rgba(43,107,255,.85) }
#cat-blacklist .blw.blw-fluxo .blw-rot i:nth-child(2){
  box-shadow:0 0 14px 3px rgba(255,43,43,.85) }

/* as cinco estrelas voltam todas */
#cat-blacklist .blw.blw-fluxo .blw-s{ display:inline-block !important; font-size:15px !important }
#cat-blacklist .blw.blw-fluxo .blw-stars{ gap:4px }

@media(max-width:420px){
  #cat-blacklist .blw.blw-fluxo{ padding:8px 14px !important; gap:10px }
  #cat-blacklist .blw.blw-fluxo .blw-rot{ width:36px !important; height:13px !important }
  #cat-blacklist .blw.blw-fluxo .blw-s{ font-size:13.5px !important }
}

/* ponto novo — o botao "Open my Blacklist" estava encostado a direita
   porque a caixa usa space-between e no telemovel o texto ocupa a linha
   toda. Passa a ficar centrado, por baixo do texto. */
@media(max-width:860px){
  #cat-blacklist .bl-notice{ justify-content:center !important; text-align:center }
  #cat-blacklist .bl-notice-in{ text-align:center; min-width:0 !important; flex:1 1 100% !important }
  #cat-blacklist .bl-notice-btn{ margin:4px auto 0; display:block }
}

/* ponto 12 — "Two names, one shop" e o texto dos brand kits, centrados
   no telemovel, como o resto da pagina */
@media(max-width:860px){
  #ex-marcas .exm-quadro.exm-txt,
  #ex-marcas .exm-quadro.exm-txt h3,
  #ex-marcas .exm-quadro.exm-txt p,
  #ex-marcas .exm-quadro.exm-txt b{ text-align:center }
  #ex-marcas .exm-quadro.exm-txt > *{ margin-left:auto; margin-right:auto }
}

/* ==================================================================
   BLOCO 177 (CSS) — 22/10/2026 — quantidade e espacadores no
   configurador de rodas (pontos 7, 8 e 9)
   O Braga: "esta tudo muito espremido junto, deixe evidente os dois
   botoes de accao, a quantidade tem espaco de sobra e os espacadores
   sao uma coisa minuscula — nem eu, que sou o dono, sabia disso".

   A quantidade passa a ter uma linha propria, com o campo a toda a
   largura e altura de dedo. Os espacadores deixam de ser um cantinho:
   ganham uma caixa com contorno dourado, titulo maior, a explicacao
   legivel e o total destacado. Sao duas decisoes diferentes, por isso
   ficam em duas caixas diferentes.
   ================================================================== */
#wh-modal .wh-row{ margin:14px 0 }
#wh-modal .wh-row label{
  font-size:12.5px; letter-spacing:.1em; text-transform:uppercase;
  color:#C9CFD8; margin-bottom:7px; font-weight:500 }
#wh-modal .wh-row select,
#wh-modal .wh-row input{
  min-height:46px; padding:11px 12px; font-size:15px }

/* a caixa dos espacadores: deixa de passar despercebida */
#wh-modal .wh-hardware.wh-spacer-up{
  margin:18px 0 14px;
  padding:16px 15px 15px;
  border:1.5px solid rgba(242,194,48,.45) !important;
  border-radius:14px;
  background:#15181D linear-gradient(180deg,rgba(242,194,48,.07),transparent 70%) !important }
#wh-modal .wh-hardware.wh-spacer-up h4{
  font-size:15px !important; letter-spacing:.06em; margin:0 0 6px !important;
  display:flex; align-items:center; gap:8px }
#wh-modal .wh-hardware.wh-spacer-up .hw-why{
  font-size:13px !important; line-height:1.55; color:#C9CFD8 !important; margin:0 0 12px }
#wh-modal .wh-hardware.wh-spacer-up select{
  width:100%; min-height:46px; padding:11px 12px; font-size:14.5px;
  background:#0E1116; border:1px solid #343A44; border-radius:9px; color:#fff;
  font-family:inherit; margin:0 0 9px }
#wh-modal .wh-hardware.wh-spacer-up #c-spacer-tot{
  font-size:15px; font-weight:600; color:#F2C230; margin-top:4px }

/* uma etiqueta por cima de cada campo, para se saber o que e cada um */
#wh-modal .wh-hardware.wh-spacer-up select#c-spacer::before{ content:'' }

@media(max-width:860px){
  #wh-modal .wh-row select,
  #wh-modal .wh-row input,
  #wh-modal .wh-hardware.wh-spacer-up select{ min-height:48px; font-size:15px }
  #wh-modal .wh-hardware.wh-spacer-up{ padding:15px 13px 14px }
}
#wh-modal .wh-hardware .hw-lbl{
  display:block; font-size:11.5px; letter-spacing:.14em; text-transform:uppercase;
  color:#9AA2AE; margin:0 0 5px; font-weight:500 }

/* ==================================================================
   BLOCO 179 (CSS) — 22/10/2026 — a mancha preta do dinamometro
   (pontos 15 a 17, segunda volta)
   Nao era o grafico. Por baixo da caixa das ferramentas ha uma faixa de
   video decorativa de 1.569px de altura (.cx-atras). O video nunca chega
   a carregar — fica em readyState 0 — e o que sobra e um rectangulo
   preto enorme, que e exactamente a mancha que ele fotografou.
   O video ja traz uma imagem de reserva (filtro_bg_m.jpg, que existe e
   responde 200), so que ela nao aparece quando o video nem comeca. Aqui
   poe-se essa mesma imagem como fundo da faixa, mais o degrade escuro da
   marca por cima. Com video ou sem video, a faixa passa a ter textura em
   vez de ser um buraco preto.
   ================================================================== */
#cat-dyno .cx-video,
#cat-dyno .cx-atras{
  background-color:#0E1116;
  background-image:linear-gradient(180deg,rgba(8,10,14,.55),rgba(8,10,14,.88)),
                   url('filtro_bg_m.jpg');
  background-size:cover; background-position:center center; background-repeat:no-repeat }
#cat-dyno .cx-video video,
#cat-dyno .cx-atras video{ background-color:transparent }
/* A chapa que vive dentro da faixa do video e recriada pelo proprio site
   de tempos a tempos — tirá-la por JavaScript era uma corrida que eu
   perdia. Esconde-se por aqui, de vez. A que conta e a que esta em fluxo,
   dentro do .section-body, essa fica. */
#cat-blacklist .tit-video .blw{ display:none !important }

/* ==================================================================
   BLOCO 180 (CSS) — 22/10/2026 — fechar a secção da música (ponto 19)
   O Braga: "quando entrei, demorei ate descobrir onde se fechava".
   O X era um quadrado de 20px, cinzento claro, sem contorno, encostado
   ao canto. Passa a ser um botao redondo com contorno dourado e area de
   toque de 42px — vê-se e acerta-se a primeira.
   ================================================================== */
#capa .trax-x, #capa #traxX{
  width:42px !important; height:42px !important;
  border-radius:50% !important;
  border:1.5px solid rgba(242,194,48,.55) !important;
  background:rgba(10,12,16,.82) !important;
  color:#F2C230 !important;
  display:flex !important; align-items:center; justify-content:center;
  font-size:21px !important; line-height:1 !important;
  top:10px !important; right:10px !important;
  box-shadow:0 8px 22px -10px rgba(0,0,0,.9) }
#capa .trax-x:hover, #capa #traxX:hover{
  background:#F2C230 !important; color:#15181D !important;
  border-color:#F2C230 !important }

/* ==================================================================
   BLOCO 181 (CSS) — 22/10/2026 — Blacklist e body kits, terceira volta
   1) A sirene estava numa pastilha escura POR CIMA DE BRANCO: a seccao
      e branca (medi rgb(255,255,255) por tras). O Braga: "retire esse
      fundo branco e deixe mesmo tudo preto". A faixa da sirene passa a
      ser uma banda preta de ponta a ponta, com a sirene ao meio.
   2) "Only the fastest make the list" crescia e encolhia sem parar: a
      medida automatica entrava em ciclo (tratado no blp.js). Aqui fica
      o tamanho fixo por clamp(), que nao depende de medicao nenhuma.
   3) No topo dos body kits o "1.731" ficava encostado a esquerda: o
      bloco e flex, e centrar o TEXTO nao centra as caixas. Agora
      centram-se as caixas.
   ================================================================== */

/* 1 — banda preta da sirene, de ponta a ponta */
#cat-blacklist .blw.blw-fluxo{
  width:100vw !important; max-width:100vw !important;
  margin-left:calc(50% - 50vw) !important;
  margin-right:calc(50% - 50vw) !important;
  margin-top:0 !important; margin-bottom:0 !important;
  padding:13px 18px !important;
  border-radius:0 !important;
  border:0 !important;
  border-top:1px solid rgba(242,194,48,.28) !important;
  border-bottom:1px solid rgba(242,194,48,.28) !important;
  background:#07080A !important }

/* 2 — tamanho estavel para a placa do neon */
#cat-blacklist .sec-count.bl-neon{
  font-size:clamp(11px, 3.4vw, 15px) !important;
  white-space:normal !important }
#cat-blacklist .sec-count.bl-neon.uma-linha{ white-space:normal !important }

/* 3 — o topo dos body kits mesmo centrado */
@media(max-width:860px){
  #cat-bodykits .bkd-topo{
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center }
  #cat-bodykits .bkd-topo > *{ margin-left:auto !important; margin-right:auto !important }
  #cat-bodykits .bkd-num{ width:auto !important; text-align:center }
  #cat-bodykits .bkd-tx{ width:100%; max-width:36ch; text-align:center }
}

/* ==================================================================
   BLOCO 184 (CSS) — 22/10/2026 — a sirene da Blacklist, terceira volta
   O Braga, com fotografia: "a sirene ta com um negocio branco nas
   barras laterais. Ta sendo comida por essas barras vermelhas e a
   barra dourada. Faca alguma coisa referente a isso, que e pra dar um
   design bonito e nao essa porcaria."

   O que estava mal: a chapa vivia dentro do .section-body, que tem
   margem lateral, e para chegar as pontas usava width:100vw com
   margens negativas. No telemovel dele esse truque falhou e ficaram
   duas tiras brancas nos lados. Por cima e por baixo apareciam ainda a
   risca vermelha da fita que corre e a risca dourada da faixa do
   titulo, a cortar a chapa em tres.

   O que passa a estar: a chapa e filha directa da seccao (feito no
   blp.js), como a fita que corre. A largura e a da pagina, sem truque
   nenhum - nao ha lado por onde entre branco. Sem contornos proprios,
   para nao acrescentar mais riscas: a faixa funde-se com a banda
   escura do titulo logo abaixo e le-se como uma peca so, com um brilho
   azul-vermelho por tras das estrelas, como a barra de luzes.
   ================================================================== */
#cat-blacklist > .blw.blw-fluxo{
  position:relative !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:12px !important;
  width:auto !important;
  max-width:none !important;
  margin:0 !important;
  padding:15px 16px !important;
  border:0 !important;
  border-radius:0 !important;
  /* Rede de seguranca contra o branco dos lados: a cor da faixa e
     pintada tambem 200px para cada lado, por sombra. A seccao corta o
     que passa das pontas (overflow-x:clip), por isso isto nao alarga a
     pagina nem faz barra de rolamento. Serve para o instante em que a
     pagina se refaz e a medida ainda nao foi reposta: nesse instante o
     Braga via duas tiras brancas. Agora nao ha instante nenhum. */
  box-shadow:-200px 0 0 0 #0A0B0D, 200px 0 0 0 #0A0B0D !important;
  background:#0A0B0D !important;
  overflow:hidden !important;
  z-index:2 }

/* o brilho da barra de luzes, por tras, sem tocar em nada */
#cat-blacklist > .blw.blw-fluxo::before{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(60% 150% at 30% 50%, rgba(40,110,255,.26), rgba(40,110,255,0) 70%),
    radial-gradient(60% 150% at 70% 50%, rgba(226,48,48,.24), rgba(226,48,48,0) 70%);
  opacity:.9 }
#cat-blacklist > .blw.blw-fluxo > *{ position:relative; z-index:1 }

/* ja nao ha chapa nenhuma por cima do video do titulo */
#cat-blacklist .tit-video .blw{ display:none !important }

/* ==================================================================
   BLOCO 185 (CSS) — 22/10/2026 — os projetos no telemovel, segunda volta
   O Braga, com fotografia: "que porcaria e essa nos projetos na parte
   mobile? Ta texto apagado, coisa de botao branco com amarelo ali,
   tudo apagado. (...) se abre pelo computador e uma coisa, pelo
   celular essa porcaria."

   Ele tem razao e o erro foi meu. A disposicao em lista de garagem foi
   a que ele aprovou e fica; o que estava mal era a cor. Pintei os
   cartoes de BRANCO, quando a seccao dos projetos e escura (medi
   rgb(11,13,17) no computador) e todo o resto da pagina e escuro. Do
   lado do telemovel ficava uma ilha branca com letras cinzentas e uma
   pastilha amarela sobre creme - "apagado", exactamente.

   Agora as cores sao as mesmas do computador, medidas la:
     cartao      sem fundo, contorno branco a 9%
     titulo      branco
     sobretitulo dourado cheio  #F2C230
     autor       #7F8794
     convite     #171A20 com tracejado dourado
     "Add my project"  dourado cheio com letra escura
   A disposicao (miniatura a esquerda, texto a direita) nao se mexe.
   ================================================================== */
@media(max-width:860px){
  html body #projects .prj-carrossel .prj-grid .prj-card{
    background:transparent !important;
    border:1px solid rgba(255,255,255,.09) !important;
    border-radius:14px !important }
  html body #projects .prj-carrossel .prj-grid .prj-card .prj-img{
    background:#15181D !important }
  html body #projects .prj-carrossel .prj-grid .prj-card .prj-eyebrow{
    color:#F2C230 !important }
  html body #projects .prj-carrossel .prj-grid .prj-card h3{
    color:#fff !important }
  html body #projects .prj-carrossel .prj-grid .prj-card .prj-by{
    color:#7F8794 !important }
  html body #projects .prj-carrossel .prj-grid .prj-card .prj-go{
    color:#F2C230 !important }

  /* a pastilha dos cavalos: dourada sobre escuro, como no computador */
  html body #projects .prj-carrossel .prj-grid .prj-card .prj-hp-chip{
    background:rgba(242,194,48,.10) !important;
    border:1px solid rgba(242,194,48,.34) !important;
    color:#C9CDD4 !important }
  html body #projects .prj-carrossel .prj-grid .prj-card .prj-hp-chip b{
    color:#F2C230 !important }

  /* o convite para entrar no mural */
  html body #projects .prj-carrossel .prj-grid .prj-card.prj-vazio{
    background:#171A20 !important;
    border:1px dashed rgba(242,194,48,.30) !important }
  html body #projects .prj-carrossel .prj-grid .prj-card.prj-vazio h3{
    color:rgba(255,255,255,.62) !important }
  html body #projects .prj-carrossel .prj-grid .prj-card.prj-vazio .prj-eyebrow,
  html body #projects .prj-carrossel .prj-grid .prj-card.prj-vazio .prj-by{
    color:#7F8794 !important }

  /* o botao de juntar um carro: dourado cheio, como no computador */
  html body #projects .prj-carrossel .prj-grid .prj-add-btn,
  html body #projects .prj-carrossel.modo-destaque .prj-grid .prj-add-btn{
    background:#F2C230 !important;
    border:2px solid #F2C230 !important;
    color:#15140C !important }
  html body #projects .prj-carrossel .prj-grid .prj-add-btn *{
    color:#15140C !important }
}

/* ==================================================================
   BLOCO 187 (CSS) — 22/10/2026 — a mancha do dinamometro, a serio
   (pontos 15-17, terceira volta — "a mancha ainda esta no dyno")
   Encontrei finalmente a razao, e o erro anterior foi meu. A imagem de
   reserva da faixa (filtro_bg_m.jpg) tem 310x346 pixeis e e uma textura
   de fibra de carbono escura — 55% dos pixeis quase pretos, media
   rgb(34,36,35). No bloco 179 pus essa imagem com background-size:cover
   numa faixa de 332x1569: a textura era esticada quatro vezes e meia e
   deixava de ser textura — virava exactamente o borrao preto que ele
   fotografou, agora com o meu degrade escuro por cima a piorar.
   Correccao: a textura passa a REPETIR-SE ao tamanho natural, como a
   fibra de carbono se repete mesmo, e o degrade por cima e mais leve,
   so o suficiente para o texto da ferramenta se ler. A faixa fica uma
   superficie, nao uma mancha.
   ================================================================== */
/* Segunda tentativa, 20h40: repetir a textura tambem nao servia — viam-se
   os quadrados da repeticao, um papel de parede barato. A faixa tem
   1.569px de altura; nenhuma fotografia de 310px aguenta isso, nem
   esticada nem repetida. Entao nao se usa fotografia nenhuma: a faixa
   passa a ser um degrade desenhado, que nao tem costuras nem borrao e
   fica igual em qualquer altura de ecra. */
#cat-dyno .cx-video,
#cat-dyno .cx-atras{
  background-color:#10131A !important;
  background-image:
    radial-gradient(120% 40% at 50% 0%, rgba(242,194,48,.07), rgba(242,194,48,0) 60%),
    linear-gradient(180deg, #171B24 0%, #11141B 38%, #0D1016 72%, #0A0C11 100%) !important;
  background-size:auto, auto !important;
  background-position:center top, center top !important;
  background-repeat:no-repeat, no-repeat !important }

/* enquanto o filme nao tem um unico fotograma, o <video> pinta-se de
   preto POR CIMA deste fundo. O blp.js baixa-lhe a opacidade nesse
   caso; aqui garante-se que ele nunca traz fundo proprio. */
#cat-dyno .cx-video video,
#cat-dyno .cx-atras video{ background-color:transparent !important }

/* ==================================================================
   BLOCO 188 (CSS) — 22/10/2026 — a tela preta do dinamometro, a causa
   Andei tres voltas a tratar o sintoma. A causa e esta, e nao e do
   grafico nem do carregamento: e a ordem por que o navegador pinta.

   A faixa decorativa de video (.cx-atras) esta escrita assim:
       .cx-atras{ position:absolute; z-index:0 }
   e vive DENTRO da caixa da ferramenta. Ora, dentro de uma mesma
   camada, o navegador pinta primeiro o conteudo normal (o que nao tem
   position) e SO DEPOIS os elementos posicionados com z-index 0. Ou
   seja: a faixa, que devia ficar atras, ficava a frente e tapava a
   ferramenta toda.

   Prova: pus um marcador cor-de-rosa com position:fixed por cima do
   sitio exacto de um texto da ferramenta — o marcador apareceu, o
   texto (forcado a verde, 20px, com fundo verde-escuro) nao apareceu
   de todo. O conteudo estava la, com o tamanho e a posicao certos, por
   baixo da faixa.

   Era por isso que ele tocava no botao dourado, o aviso fechava, e
   continuava a ver preto: por tras do aviso ja so havia a faixa.

   Correccao: a caixa passa a ser uma camada propria (isolation) e a
   faixa vai para tras do conteudo (z-index:-1), que e o lugar de um
   fundo. Nao se mexe em posicoes nem em tamanhos de nada.
   Vale tambem para as paginas de produtos, que usam a mesma faixa com
   o mesmo defeito.
   ================================================================== */
.dyno-tool, .prod-block, .cx-wrap{ isolation:isolate }
.cx-atras{ z-index:-1 !important }

/* ==================================================================
   BLOCO 189 (CSS) — 22/10/2026 — o video da capa roubava os cliques
   Na varredura final: no computador, dez botoes da capa — incluindo
   SEIS cartoes de marca (Schwitzer, BorgWarner, KKK, EFR, AirWerks,
   Mitsubishi) e os botoes "View cart" e "Checkout" — tinham o toque
   roubado pelo <video class="scene scene-desk">. Medido com
   elementFromPoint no centro de cada botao: quem recebia o dedo era o
   video, de 1555x972, esticado por cima de tudo.
   Isto e meio irmao do que se passava no telemovel com o palco do
   intro, e e tambem parte do "clico nas marcas e nao abre" que o
   Braga reportou no ponto 5.
   O video da capa e decoracao: nao tem nada para onde levar ninguem.
   Deixa de apanhar o dedo. Os botoes que estao por cima dele continuam
   a funcionar na mesma — isto so o faz deixar de os tapar.
   ================================================================== */
video.scene, video.scene-desk, video.scene-vert,
video.scene-tab, video.scene-tabl, video.scene-vertl,
.scene-fallback, .tit-ov, .cx-atras,
.tit-video > video, .cx-video > video{ pointer-events:none !important }
/* Depois de calar o video apareceu, por tras dele, uma segunda camada
   decorativa — .scene-fallback, a imagem que entra quando o filme nao
   toca — a fazer exactamente o mesmo aos mesmos botoes. Cala-se
   tambem, com as outras capas que so servem de pano de fundo. */

/* ==================================================================
   BLOCO 190 (CSS) — 22/10/2026 — o palco da capa tambem era so pano
   Calado o video e a imagem de reserva, ficou ainda a .stage por cima
   dos mesmos botoes. Conferi o que ela tem dentro: .scene-fallback,
   seis <video>, .top-fade, .floor-fade, .capa-smoke — e ZERO botoes
   ou ligacoes. E um palco fixo, do tamanho do ecra, so com pano de
   fundo. Deixa de apanhar o dedo, inteira.
   (Os cartoes de marca ja abriam a seguir as correccoes anteriores,
   porque o site apanha o toque por outro caminho; isto tira a camada
   do meio em vez de continuar a contorna-la.)
   ================================================================== */
.stage{ pointer-events:none !important }
.stage button, .stage a, .stage [onclick]{ pointer-events:auto !important }

/* ==================================================================
   BLOCO 191 (CSS) — 22/10/2026 — tres defeitos na pagina dos projetos
   O Braga, com fotografia: "ta feio isso".

   1) O QUADRADO BRANCO no canto de cima. Medido: #mobBurger tinha
      background rgb(255,255,255) — um botao branco de 46x46 no meio de
      uma pagina preta, ao lado do botao MENU que e preto com contorno
      dourado. Passa a ser igual ao irmao.
   2) O TEXTO DO TOPO POR BAIXO DO BOTAO MENU. A seccao comeca a 10px
      do topo e o botao MENU, que e fixo, ocupa dos 16px aos 62px: o
      texto de apresentacao entrava-lhe por baixo e lia-se cortado.
      Abre-se espaco por cima.
   3) Os buracos pretos entre os blocos.
   ================================================================== */

/* 1 — o botao das tres barras deixa de ser branco */
#mobBurger, .mob-burger{
  background:rgba(12,14,18,.92) !important;
  border:1.5px solid rgba(242,194,48,.55) !important;
  border-radius:12px !important;
  box-shadow:0 2px 10px rgba(0,0,0,.45) !important }
#mobBurger span, .mob-burger span{
  background:#F2C230 !important }

/* 2 — espaco por cima do texto de apresentacao dos projetos */
@media(max-width:860px){
  #projects .prj-hero{ padding-top:64px !important }
  /* 3 — os blocos deixam de ter buracos de 200px entre eles */
  #projects .prj-filter{ margin-top:14px !important; margin-bottom:10px !important }
  #projects .prj-vista-barra{ margin-top:0 !important; margin-bottom:12px !important }
  #projects .prj-carrossel{ margin-top:0 !important }
}

/* ==================================================================
   BLOCO 195 (CSS) — 22/10/2026 — PROJETOS NO TELEMOVEL, PROPOSTA B
   Escolhida pelo Braga: "cartaz com faixa de carbono".
   Substitui a lista de garagem (blocos 169 e 185), que era a proposta
   anterior. As cores sao as mesmas que medi no computador, para as
   duas versoes continuarem a ser a mesma loja.
   O convite para juntar um carro foi para o fim pelo blp.js (194).
   ================================================================== */

/* a frase por letras, quando a imagem da frase nao chega (bloco 192) */
.blp-frase-letras{
  display:inline-block; font:700 15px/1.2 Oswald,sans-serif;
  letter-spacing:.14em; text-transform:uppercase; color:#F2C230;
  text-align:center; padding:4px 10px }

@media(max-width:860px){

  /* ---- os dois selectores lado a lado, a procura por cima --------- */
  html body #projects .prj-filter{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
    padding:0 !important; margin:14px 0 12px !important }
  html body #projects .prj-filter .prj-search{
    grid-column:1 / -1 !important; width:100% !important;
    background:rgba(255,255,255,.045) !important;
    border:1px solid rgba(255,255,255,.1) !important;
    border-radius:10px !important; padding:11px 13px !important;
    font:400 13px Oswald,sans-serif !important; color:#DDE1E7 !important }
  html body #projects .prj-filter .prj-brandsel{
    width:100% !important; min-width:0 !important;
    background:rgba(255,255,255,.04) !important;
    border:1px solid rgba(255,255,255,.13) !important;
    border-radius:10px !important; padding:11px 12px !important;
    font:400 12.5px Oswald,sans-serif !important; color:#C3C9D2 !important }

  /* ---- os dois separadores numa caixa so ------------------------- */
  html body #projects .prj-vista-barra{
    display:flex !important; gap:0 !important;
    border:1px solid rgba(255,255,255,.12) !important;
    border-radius:10px !important; overflow:hidden !important;
    margin:0 0 14px !important; padding:0 !important; background:transparent !important }
  html body #projects .prj-vista-barra > button{
    flex:1 1 0 !important; margin:0 !important;
    border:0 !important; border-radius:0 !important;
    background:transparent !important;
    padding:11px 0 !important; min-height:44px;
    display:flex !important; align-items:center; justify-content:center; gap:7px;
    font:500 12px Oswald,sans-serif !important; letter-spacing:.1em !important;
    text-transform:uppercase; color:#99A1AE !important }
  html body #projects .prj-vista-barra > button.on{
    background:rgba(242,194,48,.14) !important;
    color:#F2C230 !important; font-weight:600 !important;
    box-shadow:inset 0 -2px 0 #F2C230 !important }
  html body #projects .prj-vista-barra > button svg{ width:14px; height:14px }

  /* ---- os carros em cartaz --------------------------------------- */
  html body #projects .prj-carrossel .prj-grid,
  html body #projects .prj-carrossel.modo-destaque .prj-grid{
    display:grid !important; grid-template-columns:1fr !important;
    gap:13px !important; counter-reset:blpprj !important;
    /* A grelha trazia uma ALTURA DE LINHA fixa (medi grid-template-rows:
       208,5px). Era ela que cortava o cartao a meio: a fotografia leva
       170 e o texto 136, e so havia 203. A linha passa a ter a altura do
       que la esta dentro. */
    grid-template-rows:none !important;
    grid-auto-rows:auto !important;
    align-items:start !important }

  html body #projects .prj-carrossel .prj-grid .prj-card{
    display:block !important; position:relative !important;
    grid-template-columns:none !important;
    min-height:0 !important; padding:0 !important;
    border:1px solid rgba(242,194,48,.26) !important;
    border-radius:15px !important; overflow:hidden !important;
    background:#101318 !important; box-shadow:none !important;
    counter-increment:blpprj !important;
    /* O cartao do modo "Featured" trazia altura fixa (medi 202,5px) com
       overflow:hidden — a fotografia ocupava 170 e o texto, que precisa
       de 136, ficava cortado a meio. A altura passa a ser a do conteudo. */
    height:auto !important; min-height:0 !important; max-height:none !important;
    /* E era isto: aspect-ratio 4/3. Com 270px de largura dava 202,5px de
       altura, fixos, e o overflow:hidden cortava o texto. Agora a altura
       e a do conteudo, como num cartaz. */
    aspect-ratio:auto !important }

  /* a fotografia por cima, inteira */
  html body #projects .prj-carrossel .prj-grid .prj-card .prj-img{
    position:relative !important; inset:auto !important;
    display:block !important;
    width:100% !important; max-width:none !important;
    height:170px !important; min-height:0 !important; aspect-ratio:auto !important;
    margin:0 !important; border-radius:0 !important; overflow:hidden !important;
    background:linear-gradient(140deg,#223042,#10151c) !important }
  html body #projects .prj-carrossel .prj-grid .prj-card .prj-img img{
    width:100% !important; height:100% !important; object-fit:cover !important; display:block }
  html body #projects .prj-carrossel .prj-grid .prj-card .prj-img-ov{
    display:block !important; position:absolute !important; inset:auto 0 0 0 !important;
    height:56px !important;
    background:linear-gradient(180deg,rgba(16,19,24,0),rgba(16,19,24,.85)) !important }

  /* o numero de lugar, redondo e dourado, no canto da fotografia */
  html body #projects .prj-carrossel .prj-grid .prj-card::after{
    content:counter(blpprj);
    position:absolute; right:11px; top:11px; z-index:3;
    width:30px; height:30px; border-radius:50%;
    background:#F2C230; color:#15140C;
    font:700 14px/30px Oswald,sans-serif; text-align:center;
    box-shadow:0 2px 8px rgba(0,0,0,.45) }

  /* o texto por baixo */
  html body #projects .prj-carrossel .prj-grid .prj-card .prj-info{
    position:static !important; inset:auto !important;
    width:auto !important; height:auto !important; transform:none !important;
    display:block !important; padding:13px 14px 44px !important;
    background:transparent !important }
  html body #projects .prj-carrossel .prj-grid .prj-card .prj-eyebrow{
    font:500 10px Oswald,sans-serif !important; letter-spacing:.18em !important;
    text-transform:uppercase; color:#F2C230 !important; margin:0 0 4px !important }
  html body #projects .prj-carrossel .prj-grid .prj-card h3{
    margin:0 0 8px !important; font:600 19px/1.16 Oswald,sans-serif !important;
    color:#fff !important; text-shadow:none !important;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden }
  html body #projects .prj-carrossel .prj-grid .prj-card .prj-meta-row{
    display:flex !important; align-items:center; gap:10px; margin:0 !important }
  html body #projects .prj-carrossel .prj-grid .prj-card .prj-by{
    font:400 11.5px Oswald,sans-serif !important; color:#79818E !important }
  html body #projects .prj-carrossel .prj-grid .prj-card .prj-hp-chip{
    background:rgba(242,194,48,.10) !important;
    border:1px solid rgba(242,194,48,.34) !important;
    border-radius:8px !important; padding:3px 10px !important;
    font-size:11px !important; color:#C9CDD4 !important }
  html body #projects .prj-carrossel .prj-grid .prj-card .prj-hp-chip b{
    color:#F2C230 !important; font-size:15px !important }

  /* o "View ›" encostado ao canto de baixo, a direita */
  html body #projects .prj-carrossel .prj-grid .prj-card .prj-go{
    /* vinha com inset:173.5px 14px 13px 20px de uma regra antiga: ficava
       a toda a largura e por cima do sobretitulo. Prende-se so ao canto
       de baixo a direita. */
    position:absolute !important;
    top:auto !important; left:auto !important;
    right:14px !important; bottom:13px !important;
    width:auto !important; height:auto !important;
    transform:none !important;
    display:inline-flex !important; align-items:center; gap:3px;
    font:500 11.5px Oswald,sans-serif !important; letter-spacing:.06em !important;
    color:#F2C230 !important; background:none !important;
    border:0 !important; padding:0 !important }
  html body #projects .prj-carrossel .prj-grid .prj-card .prj-go svg{
    width:14px; height:14px; display:block }

  /* o lugar vazio deixa de aparecer: o convite do fim ja o diz, e dois
     convites seguidos e uma repeticao que nao ajuda ninguem */
  html body #projects .prj-carrossel .prj-grid .prj-card.prj-vazio{ display:none !important }

  /* ---- o convite, agora no fim, com contorno tracejado ----------- */
  html body #projects .prj-convite-fim{
    display:block !important; width:auto !important; float:none !important;
    margin:13px 0 0 !important; padding:20px 16px !important;
    border:1px dashed rgba(242,194,48,.32) !important;
    border-radius:15px !important; background:#14171D !important;
    text-align:center !important }
  html body #projects .prj-convite-fim > *{
    width:auto !important; max-width:none !important; float:none !important;
    text-align:center !important; margin-left:auto !important; margin-right:auto !important }
  html body #projects .prj-convite-fim .prj-a2-sub{
    font:400 12px/1.45 Oswald,sans-serif !important; color:#8C94A1 !important;
    max-width:34ch; margin:0 auto 12px !important }
  html body #projects .prj-convite-fim .prj-a2-acto{ margin:0 !important }
  html body #projects .prj-convite-fim .prj-add-btn{
    display:inline-block !important; width:auto !important;
    background:#F2C230 !important; border:0 !important;
    color:#15140C !important; border-radius:9px !important;
    padding:12px 22px !important; min-height:44px;
    font:700 12.5px Oswald,sans-serif !important; letter-spacing:.08em !important;
    text-transform:uppercase }
  html body #projects .prj-convite-fim .prj-a2-selo{
    margin:11px 0 0 !important;
    font:400 10.5px/1.45 Oswald,sans-serif !important; color:#79818E !important }
  html body #projects .prj-convite-fim .prj-a2-selo b{ color:#F2C230 !important; font-weight:600 }

  /* a faixa de video decorativa do topo nao precisa de 80px de altura */
  html body #projects .prj-hero{ padding-top:64px !important }
}

/* ==================================================================
   BLOCO 197 (CSS) — 22/10/2026 — A BLACKLIST NO TELEMOVEL, PROPOSTA C
   Escolhida pelo Braga: "bilhete de velocidade".

   O que estava: a tabela do ranking (8 colunas) empilhada, cada celula
   numa linha a toda a largura. Um carro ocupava DOIS ecras, a foto era
   uma miniatura perdida numa faixa vazia, e o nome do carro aparecia
   colado as modificacoes.

   O que passa a estar: cada linha da tabela e um talao. A foto enche o
   topo com a posicao, o piloto e a velocidade por cima; uma linha
   picotada corta ao meio; por baixo uma ficha de quatro casas
   (carro, potencia, onde, quando) e a preparacao em rodape.
   Nao se mexe na ordem do HTML: a grelha poe cada celula na sua casa.
   ================================================================== */
@media(max-width:860px){

  html body #cat-blacklist .bl-tblwrap{ overflow:visible !important; padding:0 !important }

  html body #cat-blacklist table.bl-tbl,
  html body #cat-blacklist table.bl-tbl tbody{
    display:block !important; width:100% !important;
    border:0 !important; border-collapse:separate !important;
    background:transparent !important; box-shadow:none !important }
  html body #cat-blacklist table.bl-tbl thead{ display:none !important }

  /* ---- o talao ---------------------------------------------------- */
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    grid-template-areas:
      "foto  foto"
      "carro poten"
      "onde  quando"
      "prep  prep" !important;
    position:relative !important;
    margin:0 0 13px !important;
    border:1px solid rgba(255,255,255,.1) !important;
    border-radius:14px !important;
    overflow:hidden !important;
    background:#0F1217 !important }

  /* o primeiro lugar brilha */
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete:first-child{
    border-color:rgba(242,194,48,.45) !important }

  /* os recortes do bilhete, nas laterais, a altura do picotado */
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete::before,
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete::after{
    content:''; position:absolute; z-index:4;
    width:15px; height:15px; border-radius:50%;
    background:#0B0D11; top:121px }
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete::before{ left:-8px }
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete::after{ right:-8px }

  /* todas as celulas perdem a cara de tabela. O "background:none" e
     preciso porque as linhas do top 15 trazem um tom dourado por tras
     que, no bilhete, dava um verde-azeitona as celulas de uns e nao de
     outros. */
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td{
    display:block !important; border:0 !important; width:auto !important;
    background:transparent !important; background-image:none !important;
    box-shadow:none !important;
    text-align:left !important;
    vertical-align:top !important; white-space:normal !important }
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete.top15,
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete.top15 > td{
    background-color:transparent !important; background-image:none !important }
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete{
    background-color:#0F1217 !important }

  /* ---- a foto, em cima, a toda a largura -------------------------- */
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td:nth-child(8){
    grid-area:foto !important;
    position:relative !important;
    height:128px !important; padding:0 !important; overflow:hidden !important;
    background:
      linear-gradient(118deg,rgba(255,255,255,.06) 0 42%,rgba(255,255,255,0) 42.5%),
      radial-gradient(70% 90% at 30% 30%, #2c3846, #181f28 60%, #11161d 100%) !important }
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td:nth-child(8) img{
    width:100% !important; height:100% !important;
    max-width:none !important; max-height:none !important;
    object-fit:cover !important; display:block !important;
    border:0 !important; border-radius:0 !important; margin:0 !important;
    filter:saturate(.94) }
  /* o veu, para o texto por cima se ler sempre */
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td:nth-child(8)::after{
    content:''; position:absolute; inset:0; pointer-events:none;
    background:linear-gradient(90deg,rgba(8,9,11,.84) 0%,rgba(8,9,11,.28) 55%,rgba(8,9,11,.66) 100%) }

  /* ---- posicao, piloto e velocidade, por cima da foto ------------- */
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td.bl-rk{
    position:absolute !important; left:12px; top:9px; z-index:3;
    padding:0 !important;
    font:400 30px/1 'Racing Sans One',Oswald,sans-serif !important;
    color:#C3C9D2 !important }
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td.bl-rk.top1{ color:#F2C230 !important }
  /* a palavra "lugar" por baixo do numero */
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td.bl-rk::after{
    content:''; display:block; height:0 }

  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td:nth-child(2){
    position:absolute !important; left:12px; top:44px; right:120px; z-index:3;
    padding:0 !important }
  /* O nome tem de ficar na mesma linha da estrela. Em coluna, o flex
     punha a estrela sozinha numa linha e o nome noutra, porque o nome
     e um pedaco de texto solto dentro da celula. Em bloco, a estrela e
     o nome fluem juntos e so a pastilha do Instagram desce. */
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete .bl-gt{
    display:block !important;
    font:600 16px/1.2 Oswald,sans-serif !important; color:#fff !important;
    text-shadow:0 1px 6px rgba(0,0,0,.75) }
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete .bl-socs{
    display:block !important; margin-top:7px !important; text-shadow:none }
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete .bl-star{
    font-size:12px !important; margin-right:2px }
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete .bl-soc{
    display:inline-flex !important; align-items:center; gap:5px;
    background:rgba(8,9,11,.6) !important;
    border:1px solid rgba(255,255,255,.16) !important;
    border-radius:999px !important; padding:3px 9px !important;
    font:400 10.5px Oswald,sans-serif !important; color:#AEB5C0 !important;
    text-decoration:none !important; text-shadow:none }
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete .bl-soc svg{
    width:11px !important; height:11px !important; flex:0 0 auto }

  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td.bl-sp{
    /* prende-se pelo TOPO, nao pelo fundo: o elemento a que se agarra e
       o talao inteiro (357px), e "bottom:10px" atirava a velocidade para
       o fundo do talao, por baixo da preparacao. A foto tem 128px, por
       isso 84 deixa-a assente no canto de baixo da fotografia. */
    position:absolute !important; right:12px; top:84px; bottom:auto !important; z-index:3;
    padding:0 !important; text-align:right !important;
    font:400 32px/.95 'Racing Sans One',Oswald,sans-serif !important;
    font-style:italic !important; color:#fff !important;
    text-shadow:0 2px 10px rgba(0,0,0,.8) !important }

  /* ---- o picotado -------------------------------------------------- */
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td:nth-child(4){
    border-top:1px dashed rgba(255,255,255,.18) !important }
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td:nth-child(5){
    border-top:1px dashed rgba(255,255,255,.18) !important }

  /* ---- a ficha de quatro casas ------------------------------------ */
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td:nth-child(4){ grid-area:carro !important }
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td:nth-child(5){ grid-area:poten !important }
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td:nth-child(6){ grid-area:onde !important }
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td:nth-child(7){ grid-area:quando !important }
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td.bl-prep{ grid-area:prep !important }

  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td:nth-child(4),
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td:nth-child(5),
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td:nth-child(6),
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td:nth-child(7){
    padding:9px 12px !important;
    font:600 13px/1.2 Oswald,sans-serif !important; color:#E6E9ED !important;
    border-bottom:1px solid rgba(255,255,255,.06) !important }
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td:nth-child(4),
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td:nth-child(6){
    border-right:1px solid rgba(255,255,255,.06) !important }
  /* a potencia em dourado, que e o numero que interessa */
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td:nth-child(5){
    color:#F2C230 !important; font-weight:400 !important;
    font-family:'Racing Sans One',Oswald,sans-serif !important; font-size:16px !important }

  /* as etiquetas por cima de cada dado, lidas do cabecalho da tabela */
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td[data-rot]::before{
    content:attr(data-rot);
    display:block; margin-bottom:3px;
    font:500 8.5px/1 Oswald,sans-serif; letter-spacing:.17em;
    text-transform:uppercase; color:#5F6773 }

  /* estas tres estavam marcadas para desaparecer no telemovel: voltam,
     porque no bilhete ha lugar para elas */
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td.bl-hidem{
    display:block !important }

  /* ---- a preparacao, em rodape ------------------------------------ */
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete > td.bl-prep{
    padding:9px 12px 12px !important;
    font:400 11px/1.45 Oswald,sans-serif !important; color:#9AA2AE !important }
  html body #cat-blacklist table.bl-tbl tbody tr.bl-bilhete .bl-mods{
    font:inherit !important; color:inherit !important;
    margin:0 !important; padding:0 !important; display:block !important }

  /* NOTA para quem vier a seguir: aqui esteve "tr:not(.bl-bilhete)
     {opacity:0}" para a tabela nao piscar empilhada antes do blp.js a
     arrumar. Tirei-o de proposito. Se o blp.js falhar, ou se aparecer
     uma linha com menos de oito celulas, essa regra deixava o ranking
     INVISIVEL para sempre — e um ranking invisivel e muito pior do que
     um instante de tabela mal arrumada. Nao voltar a por. */
}

/* ==================================================================
   BLOCO 198 (CSS) — 22/10/2026 — os tres botoes amarelos, terceira vez
   O Braga, pela terceira vez: "os botoes amarelos do home la embaixo
   ainda nao funcionam".
   Nas duas primeiras procurei camadas por cima. Desta vez medi o ALVO,
   e a resposta estava a vista:

       altura ..........  15px
       largura .........  41 a 70px
       espaco interior .  0px
       entre eles ......  14px
       do fundo do ecra.  59px

   Quinze pixeis de altura. O minimo para um dedo sao 44. Nao e que o
   toque fosse roubado: e que o alvo e pequeno demais para se acertar.
   E pior — a 59px do fundo, num iPhone, aquela tira e onde vive a barra
   do Safari e o gesto de voltar ao inicio; o sistema fica com muitos
   toques antes de a pagina os ver.

   PRIMEIRA TENTATIVA: transformei-os em pastilhas de 44px com contorno
   dourado. Funcionava, mas o Braga nao quis: "eu quero do jeito que
   estava anteriormente, mas que quando eu clicasse nele, ele abria a
   pagina. Nao precisa ser esse botao desse jeito."

   E justo, e da para ter as duas coisas. O que se ve volta a ser o que
   era — letra dourada de 12px com o tracejado por baixo, nada de
   pastilhas. O que CRESCE e so a area que apanha o dedo: um ::after
   invisivel que estica 15px para cima e para baixo e 11px para os
   lados. O dedo passa a ter 45px de altura para acertar; os olhos
   continuam a ver o mesmo de antes.
   Fica tambem um pouco mais acima do fundo, o suficiente para sair da
   tira de gestos do telemovel — isso nao se ve, mas e o que impede o
   sistema de ficar com o toque antes da pagina o receber.
   ================================================================== */
@media(max-width:860px){
  .mob-menu-footer{
    padding-bottom:calc(10px + env(safe-area-inset-bottom, 0px)) !important }

  /* mais espaco entre eles, para as areas de toque nao se pisarem */
  .mob-menu-footer .mmf-row{
    display:flex !important; flex-wrap:wrap !important;
    justify-content:center !important; align-items:center !important;
    gap:26px !important; margin-top:4px !important; padding:0 8px !important }

  /* o aspeto de antes, tal e qual */
  .mob-menu-footer .mmf-row a{
    position:relative !important;
    display:inline-block !important;
    min-height:0 !important; min-width:0 !important;
    padding:0 !important;
    border:0 !important;
    border-bottom:1px dotted rgba(242,194,48,.5) !important;
    border-radius:0 !important;
    background:none !important;
    color:#F2C230 !important;
    font:400 12px/1.25 Oswald,sans-serif !important;
    letter-spacing:normal !important;
    text-decoration:none !important;
    white-space:nowrap !important;
    touch-action:manipulation !important;
    -webkit-tap-highlight-color:transparent }

  /* a area de toque: invisivel, mas e ela que o dedo acerta */
  .mob-menu-footer .mmf-row a::after{
    content:''; position:absolute;
    left:-11px; right:-11px; top:-15px; bottom:-15px;
    border-radius:8px }

  /* sinal de que foi tocado, sem mudar a forma */
  .mob-menu-footer .mmf-row a:active{
    color:#fff !important;
    border-bottom-color:#fff !important }
}

/* ==================================================================
   BLOCO 199 (CSS) — 22/10/2026 — a seccao "Chats" do painel
   Acompanha o bloco 199 do blp.js. Duas coisas:
   1) o desenho da aba nova (interruptores, lista de conversas);
   2) a regra que tira o icone do Tej do ecra. O Braga foi claro: "o Tej
      Parker eu nao quero nenhum icon na tela. Ele vai aparecer no chat
      ali para quem quiser conversar com ele". A classe no <html> e posta
      pelo blp.js conforme o interruptor.
   ================================================================== */

/* --- o Tej sem icone na tela ------------------------------------- */
html.blp-tej-sem-icone .tej-fab,
html.blp-tej-sem-icone #tej-fab,
html.blp-tej-sem-icone .tej-bolha,
html.blp-tej-sem-icone .tej-flutua,
html.blp-tej-sem-icone .blmap-acts .a-tej,
html.blp-tej-sem-icone .tej-launcher{ display:none !important }

/* --- a aba Chats -------------------------------------------------- */
#ap-chats .chq-card{ margin-bottom:14px }
#ap-chats .chq-grupo{
  margin-top:12px; border:1px solid rgba(255,255,255,.1); border-radius:12px; overflow:hidden }
#ap-chats .chq-linha{
  display:flex; align-items:center; gap:14px;
  padding:13px 14px; border-bottom:1px solid rgba(255,255,255,.07) }
#ap-chats .chq-linha:last-child{ border-bottom:0 }
#ap-chats .chq-tx{ flex:1; min-width:0 }
/* so o titulo e que e um bloco. Antes apanhava QUALQUER <b> dentro da
   caixa, e o <b> que estava no meio da frase de baixo partia a linha. */
#ap-chats .chq-tx > b{
  display:block; font:600 13.5px Oswald,sans-serif; color:#E6E9ED; letter-spacing:.01em }
#ap-chats .chq-filho{ padding-left:30px; background:rgba(255,255,255,.02) }
#ap-chats .chq-filho .chq-tx > b{ font-size:12.5px; color:#C9CDD4 }
#ap-chats .chq-tx i{
  display:block; font-style:normal; margin-top:3px;
  font:400 11.5px/1.45 Oswald,sans-serif; color:#8C94A1 }

/* o interruptor */
#ap-chats .chq-sw{ position:relative; flex:0 0 auto; width:46px; height:26px; cursor:pointer }
#ap-chats .chq-sw input{ position:absolute; opacity:0; width:0; height:0 }
#ap-chats .chq-sw span{
  position:absolute; inset:0; border-radius:999px;
  background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.18);
  transition:background .16s, border-color .16s }
#ap-chats .chq-sw span::after{
  content:''; position:absolute; left:3px; top:3px; width:18px; height:18px;
  border-radius:50%; background:#8C94A1; transition:transform .16s, background .16s }
#ap-chats .chq-sw input:checked + span{
  background:rgba(242,194,48,.26); border-color:rgba(242,194,48,.6) }
#ap-chats .chq-sw input:checked + span::after{
  transform:translateX(20px); background:#F2C230 }

#ap-chats .chq-acto{ display:flex; align-items:center; gap:12px; margin-top:13px; flex-wrap:wrap }
#ap-chats .chq-pub{
  background:#F2C230; color:#15140C; border:0; border-radius:9px;
  padding:11px 18px; min-height:44px;
  font:700 12.5px Oswald,sans-serif; letter-spacing:.07em;
  text-transform:uppercase; cursor:pointer }
#ap-chats .chq-pub:hover{ filter:brightness(1.07) }
#ap-chats .chq-msg{ font:400 12px Oswald,sans-serif; color:#8C94A1 }
#ap-chats .chq-bom{ color:#2EC77A }
#ap-chats .chq-mau{ color:#E0574E }

/* a lista das conversas */
#ap-chats .chq-cnt{
  display:inline-block; margin-left:7px; vertical-align:middle;
  background:rgba(242,194,48,.16); border:1px solid rgba(242,194,48,.4);
  border-radius:999px; padding:1px 9px;
  font:600 11px Oswald,sans-serif; color:#F2C230 }
#ap-chats .chq-tbl-wrap{ margin-top:12px; overflow-x:auto }
#ap-chats .chq-tbl{ width:100%; border-collapse:collapse; font-family:Oswald,sans-serif }
#ap-chats .chq-tbl th{
  text-align:left; padding:8px 10px;
  font:500 9.5px Oswald,sans-serif; letter-spacing:.16em; text-transform:uppercase;
  color:#5F6773; border-bottom:1px solid rgba(255,255,255,.1) }
#ap-chats .chq-tbl td{
  padding:10px; border-bottom:1px solid rgba(255,255,255,.06);
  font:400 12.5px Oswald,sans-serif; color:#C9CDD4; vertical-align:top }
#ap-chats .chq-tbl td b{ color:#fff; font-weight:600 }
#ap-chats .chq-c{ text-align:center; white-space:nowrap }
#ap-chats .chq-dt{ color:#79818E; font-size:11.5px }
#ap-chats .chq-num{ color:#79818E; font-size:11px }
#ap-chats .chq-ult{ color:#79818E; font-size:11.5px; margin-top:3px; line-height:1.35 }
#ap-chats .chq-tipo{ font-size:15px }
#ap-chats .chq-un{
  display:inline-block; background:#E0574E; color:#fff; border-radius:999px;
  padding:1px 8px; font:600 11px Oswald,sans-serif }
#ap-chats .chq-abrir{
  background:transparent; border:1px solid rgba(242,194,48,.5); color:#F2C230;
  border-radius:8px; padding:7px 13px; min-height:38px;
  font:500 11.5px Oswald,sans-serif; cursor:pointer }
#ap-chats .chq-abrir:hover{ background:rgba(242,194,48,.14) }
#ap-chats .chq-vazio{
  text-align:center; color:#79818E; padding:26px 10px !important; font-size:12px }

@media(max-width:860px){
  #ap-chats .chq-linha{ gap:10px; padding:12px }
  #ap-chats .chq-tbl td, #ap-chats .chq-tbl th{ padding:8px 7px }
}

/* ==================================================================
   BLOCO 200 (CSS) — 23/10/2026 — A PAGINA DO TEJ PARKER, PROPOSTA A
   Escolhida pelo Braga: "ficha de especialista".
   Acompanha o bloco 200 do blp.js, que abre a coluna do retrato e
   reparte a linha dos tres pedacos. Aqui so se veste.

   Dos seis defeitos que medi na fotografia dele, estes sao os que se
   resolvem com estilo: o fundo branco com caixas pretas (passa a ser
   escuro de uma ponta a outra, como o resto do site), a regra escrita
   em creme palido que ninguem lia, e o texto todo encostado a
   esquerda com um terco do ecra vazio.
   ================================================================== */

/* ---- a ficha: retrato a esquerda, tudo o resto a direita ---------
   ERRO MEU, apanhado na primeira publicacao: desenhei isto a contar
   com fundo escuro, como estava na proposta. Mas esta pagina e CLARA
   (o branco e o normal do site desde que o Braga o aprovou), e o
   resultado foi o titulo e as frases a branco sobre branco —
   invisiveis. A ficha passa a ser uma CHAPA ESCURA dentro da pagina
   clara, como as outras bandas escuras do site. Assim fica como ele
   aprovou e le-se. */
#cat-tej .tejA-hero{
  display:grid;
  grid-template-columns:320px 1fr;
  gap:38px;
  align-items:start;
  padding:32px 34px;
  margin:10px 0 0;
  border-radius:18px;
  background:linear-gradient(135deg,#12161D 0%,#0A0C10 62%);
  border:1px solid rgba(242,194,48,.22);
  box-shadow:0 14px 40px rgba(0,0,0,.28);
  position:relative; overflow:hidden }
#cat-tej .tejA-hero::after{
  content:''; position:absolute; inset:0; pointer-events:none;
  background:repeating-linear-gradient(118deg,rgba(255,255,255,.022) 0 2px,transparent 2px 9px) }
#cat-tej .tejA-esq, #cat-tej .tejA-dir{ position:relative; z-index:1 }

/* dentro da chapa escura, as letras tem de ser claras — a pagina e
   branca e as regras dela pintavam isto de escuro sobre escuro */
#cat-tej .tejA-hero h2.sec-title,
#cat-tej .tejA-hero h2.sec-title *{
  color:#fff !important; -webkit-text-fill-color:#fff !important;
  text-shadow:none !important }
#cat-tej .tejA-hero .eyebrow,
#cat-tej .tejA-hero .eyebrow *{ color:#F2C230 !important }
#cat-tej .tejA-hero .cat-intro p{ color:#C9CDD4 !important }
#cat-tej .tejA-hero .cat-intro p strong,
#cat-tej .tejA-hero .cat-intro p b{ color:#fff !important }
#cat-tej .tejA-hero .tejp-hint{ color:#8C94A1 !important }

#cat-tej .tejA-esq{ position:relative }
#cat-tej .tejA-moldura{
  width:320px; height:320px; border-radius:18px; overflow:hidden;
  border:1px solid rgba(242,194,48,.35);
  box-shadow:0 18px 44px rgba(0,0,0,.6);
  background:linear-gradient(135deg,#223042,#10151c) }
#cat-tej .tejA-moldura img{
  width:100%; height:100%; object-fit:cover; display:block }
#cat-tej .tejA-moldura.sem-foto::after{
  content:'TEJ'; position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  font:700 40px Oswald,sans-serif; color:rgba(242,194,48,.5) }

/* o selo verde: diz que ele responde, e quando */
#cat-tej .tejA-selo{
  display:inline-flex; align-items:center; gap:8px; margin-top:14px;
  background:rgba(46,199,122,.12); border:1px solid rgba(46,199,122,.45);
  border-radius:999px; padding:7px 14px;
  font:400 11.5px Oswald,sans-serif; letter-spacing:.07em;
  color:#2EC77A; text-transform:none }
#cat-tej .tejA-selo::first-letter{ text-transform:uppercase }
#cat-tej .tejA-selo i{
  width:7px; height:7px; border-radius:50%; background:#2EC77A; display:block; flex:0 0 auto }

/* ---- a coluna da direita ---------------------------------------- */
#cat-tej .tejA-dir{ min-width:0; text-align:left }
#cat-tej .tejA-dir > .eyebrow{
  text-align:left !important; margin:0 0 4px !important }
#cat-tej .tejA-dir > h2.sec-title{
  text-align:left !important; margin:0 !important;
  font-size:clamp(34px, 4.2vw, 52px) !important; line-height:.98 !important }

/* o cargo, por baixo do nome */
#cat-tej .tejA-dir > .tejA-papel{
  text-align:left !important; margin:9px 0 0 !important;
  font:600 15px Oswald,sans-serif !important;
  letter-spacing:.14em !important; text-transform:uppercase;
  color:#F2C230 !important;
  border:0 !important; background:none !important; padding:0 !important;
  white-space:normal !important }

/* as etiquetas, do que sobrou da mesma linha */
#cat-tej .tejA-tags{
  display:flex; gap:9px; flex-wrap:wrap; margin-top:16px }
/* "capitalize" dava "Answers In The Chat", com maiuscula em cada
   palavra, que se le mal. So a primeira letra sobe. */
#cat-tej .tejA-tags span{
  border:1px solid rgba(255,255,255,.15); border-radius:7px;
  padding:7px 13px; font:400 11.5px Oswald,sans-serif;
  letter-spacing:.05em; color:#AEB5C0; text-transform:none }
#cat-tej .tejA-tags span::first-letter{ text-transform:uppercase }

#cat-tej .tejA-dir > .cat-intro{
  margin:20px 0 0 !important; text-align:left !important; max-width:62ch }
#cat-tej .tejA-dir > .cat-intro p{
  font:400 15.5px/1.62 Oswald,sans-serif !important;
  color:#C9CDD4 !important; margin:0 0 11px !important; text-align:left !important }
#cat-tej .tejA-dir > .cat-intro p strong{ color:#fff !important; font-weight:600 }

/* ---- a caixa de perguntar --------------------------------------- */
#cat-tej .tejA-dir > form.tejp-ask{
  display:flex !important; gap:11px !important; margin:22px 0 0 !important;
  max-width:640px; justify-content:flex-start !important }
#cat-tej .tejA-dir > form.tejp-ask input{
  flex:1 !important; min-width:0;
  background:#0C0F14 !important; border:1px solid rgba(255,255,255,.17) !important;
  border-radius:12px !important; padding:16px 18px !important;
  font:400 15px Oswald,sans-serif !important; color:#fff !important }
#cat-tej .tejA-dir > form.tejp-ask input::placeholder{ color:#6B727E }
#cat-tej .tejA-dir > form.tejp-ask button{
  background:#F2C230 !important; color:#15140C !important; border:0 !important;
  border-radius:12px !important; padding:0 26px !important; min-height:52px;
  font:700 13.5px Oswald,sans-serif !important; letter-spacing:.1em !important;
  text-transform:uppercase; cursor:pointer }

/* as sugestoes, que antes nao existiam */
#cat-tej .tejA-chips{
  display:flex; gap:8px; flex-wrap:wrap; margin-top:13px; max-width:720px }
#cat-tej .tejA-chip{
  border:1px solid rgba(242,194,48,.3); border-radius:999px;
  padding:9px 14px; min-height:40px;
  background:rgba(242,194,48,.06); color:#E4C96B;
  font:400 12.5px Oswald,sans-serif; cursor:pointer;
  text-align:left }
#cat-tej .tejA-chip:hover{ background:rgba(242,194,48,.14); border-color:rgba(242,194,48,.55) }

#cat-tej .tejA-dir > .tejp-hint{
  text-align:left !important; margin:14px 0 0 !important;
  font:400 12.5px Oswald,sans-serif !important; color:#79818E !important }
#cat-tej .tejA-dir > .tejp-acts{
  justify-content:flex-start !important; margin:14px 0 0 !important }

/* ---- a regra, que estava em creme palido ------------------------ */
#cat-tej .tejp-rule{
  background:#0E1116 !important;
  border:0 !important; border-left:4px solid #F2C230 !important;
  border-radius:0 8px 8px 0 !important;
  padding:20px 24px !important; margin:10px 0 0 !important;
  font:400 13.5px/1.65 Oswald,sans-serif !important;
  color:#C3C9D2 !important; text-align:left !important }
#cat-tej .tejp-rule strong{
  display:block; margin-bottom:5px;
  color:#F2C230 !important; font-weight:600;
  letter-spacing:.06em; text-transform:uppercase; font-size:12.5px }

/* ---- telemovel: uma coluna, retrato mais pequeno ---------------- */
@media(max-width:860px){
  #cat-tej .tejA-hero{
    grid-template-columns:1fr !important; gap:20px !important;
    padding:20px 0 22px !important; justify-items:center }
  #cat-tej .tejA-esq{ text-align:center }
  #cat-tej .tejA-moldura{
    width:160px !important; height:160px !important; border-radius:50% !important;
    margin:0 auto }
  #cat-tej .tejA-dir{ text-align:center }
  #cat-tej .tejA-dir > .eyebrow,
  #cat-tej .tejA-dir > h2.sec-title,
  #cat-tej .tejA-dir > .tejA-papel,
  #cat-tej .tejA-dir > .cat-intro,
  #cat-tej .tejA-dir > .cat-intro p,
  #cat-tej .tejA-dir > .tejp-hint{ text-align:center !important }
  #cat-tej .tejA-tags,
  #cat-tej .tejA-chips{ justify-content:center }
  #cat-tej .tejA-dir > form.tejp-ask{
    flex-direction:column !important; max-width:none }
  #cat-tej .tejA-dir > form.tejp-ask button{ min-height:48px; padding:14px !important }
  #cat-tej .tejA-dir > .tejp-acts{ justify-content:center !important; flex-wrap:wrap }
}

/* ===== bloco 201 — o cabecalho "Download the guides" no /tej estava apagado
   ----------------------------------------------------------------------
   A seccao #cat-tej leva a classe .tem-capa-video, e a regra dessa classe
   pinta QUALQUER .eyebrow que seja filho directo de .section-body de
   dourado com um brilho preto por tras. Essa regra foi escrita para texto
   assente por cima do video da capa, onde o dourado se le bem.
   Este cabecalho, porem, assenta no branco da pagina clara
   (body.teste-branco), e dourado sobre branco nao se le — e exactamente
   isto que aparece "apagado": o » HIS KNOWLEDGE, BY CATEGORY « quase nao
   se ve, e o brilho preto ainda o suja mais.
   Aqui, e so dentro de #cat-tej, repoe-se o ambar escuro que o resto da
   pagina clara ja usa (#8A6A00, o mesmo de 12442), mata-se o brilho e
   dao-se as aspas o vermelho da marca, que no branco se le.
   O cabecalho da ficha do Tej vive dentro de .tejA-hero e NAO e filho
   directo de .section-body, por isso nao e tocado por nada disto — continua
   dourado sobre a chapa escura, como ficou aprovado.
   As outras paginas com .tem-capa-video (/blacklist, /bodykits,
   /performance, /rims, /dyno) tem a eyebrow por cima do video: ficam como
   estao. ===== */
body.teste-branco #cat-tej.tem-capa-video > .section-body > .eyebrow{
  color:#8A6A00 !important;
  text-shadow:none !important;
  font-size:12.5px !important;
  letter-spacing:.28em !important;
  opacity:1 !important;
}
body.teste-branco #cat-tej.tem-capa-video > .section-body > .eyebrow::before,
body.teste-branco #cat-tej.tem-capa-video > .section-body > .eyebrow::after{
  color:#C8102E !important;
}
/* o titulo e a linha de baixo ja sao escuros, mas levam aqui o preto e o
   cinzento da pagina clara a ferro e fogo, para o caso de a capa de video
   do topo crescer e passar por tras deste bloco nalgum telemovel */
body.teste-branco #cat-tej.tem-capa-video > .section-body > h3.sec-title{
  color:#0A0B0D !important;
  text-shadow:none !important;
}
body.teste-branco #cat-tej.tem-capa-video > .section-body > h3.sec-title + .sec-count{
  color:#39404A !important;
  text-shadow:none !important;
}

/* ======================================================================
   bloco 203 — o chip de idioma passa a ser uma pastilha, como os outros
   O Braga (24/10): "bandeira idiomas em cima desalinhada".
   O Braga (25/10): "o que e essa bandeira feita sem estar dentro de botao?"
   Tinha razao nas duas. O envio (#blpmkt) e a moeda (#blpcur) sao pastilhas
   .lg-btn com icone + texto, 31px de altura. O idioma era uma bandeira solta
   num circulo de 40px: outra forma, outro tamanho, e, por ser mais alto, a
   legenda SPRACHE caia 4,5px abaixo de VERSAND e WAHRUNG.
   Agora o idioma e a mesma pastilha: bandeira + codigo + seta, igual ao EUR.
   A altura passa a ser a mesma por construcao, por isso as tres legendas
   caem na mesma linha sem contas a mao.
   O <div> por fora existe por duas razoes: e onde a legenda se agarra (como
   nos outros dois) e porque uma .lg-btn filha DIRECTA de #blplang e escondida
   la em cima (regra do botao flutuante antigo).
   ====================================================================== */
@media(min-width:1025px){
  #blplang #blp-lang-top{
    position:relative;
    display:block !important;
    width:auto !important; height:auto !important;
    padding:0 !important; border:0 !important;
    background:transparent !important; border-radius:0 !important;
  }
  #blplang #blp-lang-top .lg-btn{
    background:rgba(0,0,0,.78); border:1px solid #2a2e36; border-radius:22px;
    padding:7px 14px; color:#fff; font-family:'Oswald',sans-serif;
    font-size:13px; letter-spacing:.5px; cursor:pointer;
    display:flex; align-items:center; gap:8px;
    transition:border-color .15s, background .15s;
  }
  #blplang #blp-lang-top .lg-btn:hover{border-color:#F2C230; background:rgba(0,0,0,.9)}
  #blplang #blp-lang-top .lg-btn:active{transform:scale(.97)}
  /* a bandeira fica do tamanho do globo e do cifrao dos outros dois */
  #blplang #blp-lang-top .lg-flag{
    font-size:15px; line-height:1; display:inline-flex; align-items:center;
  }
  #blplang #blp-lang-top .lg-flag svg,
  #blplang #blp-lang-top .lg-flag .blp-flag{
    width:21px; height:14px; display:block; border-radius:2px;
  }
  #blplang #blp-lang-top .lg-code{letter-spacing:.5px}
}
@media(max-width:1024px){
  #blplang #blp-lang-top{display:none !important}
}

/* ======================================================================
   bloco 207 — o icone do Tej sai do ecra, a serio desta vez
   O Braga, varias vezes, a ultima a 25/10/2026: "eu nao quero o icon do
   Tej no meio da tela. E so para estar no menu principal, e quem quiser
   clica ali ou abre o chat. Desktop, tablet e telemovel."
   A classe html.blp-tej-sem-icone ja existia e ja estava posta, mas a
   lista de alvos nao incluia o unico que aparece mesmo: o #tej-launch —
   um botao fixo, z-index 10085, em baixo a esquerda. Era por isso que a
   configuracao dizia "sem icone" e o icone continuava la.
   Aqui fecha-se por id, com !important, e tambem a bolha do chat do Tej,
   em todos os tamanhos de ecra. O Tej continua no menu principal e dentro
   do chat — so deixa de tapar o site.
   ====================================================================== */
html.blp-tej-sem-icone #tej-launch,
html.blp-tej-sem-icone #tej-fab,
html.blp-tej-sem-icone #tejLaunch,
html.blp-tej-sem-icone .tej-launch,
html.blp-tej-sem-icone [id^="tej-launch"],
html.blp-tej-sem-icone [class*="tej-launch"]{
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
}
@media(max-width:720px){
  html.blp-tej-sem-icone #tej-launch{ display:none !important }
}
@media(min-width:721px) and (max-width:1024px){
  html.blp-tej-sem-icone #tej-launch{ display:none !important }
}
@media(min-width:1025px){
  html.blp-tej-sem-icone #tej-launch{ display:none !important }
}

/* ======================================================================
   bloco 208 — tabela de produtos e margens do painel, proposta C
   O Braga escolheu a C e pediu as somas do site e a foto do produto na
   linha. A foto vive dentro da coluna "Identificacao", que e a que fica
   colada a esquerda: arrasta-se a tabela para o lado e continua-se a ver
   foto, nome e codigo.
   Cabecalho em duas linhas (faixas + colunas), ambas coladas ao topo.
   Coluna de accoes colada a direita, botoes lado a lado e nunca
   sobrepostos — era a queixa de "botao em cima de botao".
   ====================================================================== */
#adm-prod-kpis .apk-barra{
  display:grid; grid-template-columns:repeat(7,1fr); gap:11px; margin:4px 0 13px;
}
@media(max-width:1500px){ #adm-prod-kpis .apk-barra{ grid-template-columns:repeat(4,1fr) } }
@media(max-width:900px){  #adm-prod-kpis .apk-barra{ grid-template-columns:repeat(2,1fr) } }
#adm-prod-kpis .apk{
  background:#0c0e12; border:1px solid #1b1f27; border-radius:13px; padding:14px 16px;
}
#adm-prod-kpis .apk-t{
  font-size:10px; letter-spacing:.19em; color:#8d949e; text-transform:uppercase; font-weight:500;
}
#adm-prod-kpis .apk-v{
  font-size:21px; color:#fff; font-weight:600; margin-top:6px;
  font-variant-numeric:tabular-nums; white-space:nowrap;
}
#adm-prod-kpis .apk-v.ouro{color:#F2C230}
#adm-prod-kpis .apk-v.verde{color:#5fd08a}
#adm-prod-kpis .apk-v.vermelho{color:#e07a7a}
#adm-prod-kpis .apk-v.cinza{color:#9aa0a8}
#adm-prod-kpis .apk-n{font-size:11px; color:#6f7782; margin-top:3px}
.apk-falta{
  display:inline-flex; align-items:center; gap:8px; margin:0 0 12px;
  color:#aeb6c2; font-size:12.5px; cursor:pointer; user-select:none;
}
.apk-falta input{accent-color:#F2C230; width:15px; height:15px; cursor:pointer}

.apc-rolo{
  border:1px solid #1d222b; border-radius:14px; background:#0c0e12;
  overflow:auto; max-height:70vh;
}
table.apc-tab{
  border-collapse:separate; border-spacing:0; width:100%; min-width:1500px; font-size:13px;
}
table.apc-tab thead tr.apc-faixas th{
  position:sticky; top:0; z-index:7; background:#11151d; color:#F2C230;
  font-size:9.5px; letter-spacing:.22em; text-transform:uppercase; font-weight:600;
  padding:9px 13px; border-bottom:1px solid #1d222b; text-align:left; white-space:nowrap;
}
table.apc-tab thead tr.apc-cols th{
  position:sticky; top:32px; z-index:6; background:#151922; color:#aeb6c2; text-align:left;
  font-weight:500; font-size:10px; letter-spacing:.16em; text-transform:uppercase;
  padding:11px 13px; border-bottom:1px solid #262c37; white-space:nowrap;
}
table.apc-tab th.apc-num, table.apc-tab td.apc-num{text-align:right; font-variant-numeric:tabular-nums}
table.apc-tab th.apc-sep, table.apc-tab td.apc-sep{border-left:1px solid #242b36}
table.apc-tab tbody td{padding:11px 13px; border-bottom:1px solid #161a21; white-space:nowrap; vertical-align:middle}
table.apc-tab tbody tr:nth-child(even){background:rgba(255,255,255,.015)}
table.apc-tab tbody tr:hover{background:rgba(242,194,48,.05)}
table.apc-tab tbody tr.apc-incompleta{background:rgba(216,74,74,.05)}
table.apc-tab tbody tr.apc-incompleta:hover{background:rgba(216,74,74,.09)}

/* coluna do produto, com foto, colada a esquerda */
table.apc-tab th.apc-fix, table.apc-tab td.apc-fix{
  position:sticky; left:0; z-index:4; background:#0c0e12; border-right:1px solid #1d222b;
  min-width:330px; max-width:330px; white-space:normal;
}
table.apc-tab thead tr.apc-faixas th.apc-fix{z-index:8; background:#11151d}
table.apc-tab thead tr.apc-cols th.apc-fix{z-index:8; background:#151922}
table.apc-tab tbody tr:nth-child(even) td.apc-fix{background:#0e1115}
table.apc-tab tbody tr:hover td.apc-fix{background:#141720}
table.apc-tab tbody tr.apc-incompleta td.apc-fix{background:#151013}
.apc-id{display:flex; gap:11px; align-items:center}
.apc-img{width:46px; height:36px; object-fit:cover; border-radius:6px; background:#f3f3f3; flex:0 0 auto}
.apc-sem{width:46px; height:36px; border-radius:6px; background:#15191f; border:1px dashed #2a303a; flex:0 0 auto; display:block}
.apc-nome{display:block; color:#eef0f3; font-weight:400; line-height:1.32; font-size:13px}
.apc-sku{display:block; color:#6f7782; font-size:10.5px; letter-spacing:.08em; margin-top:3px}

.apc-final{color:#fff; font-weight:500}
.apc-luc{color:#5fd08a; font-weight:500}
.apc-vaz{color:#4d535c}
.apc-vaz2{color:#9aa0a8}
.apc-falta{
  background:rgba(216,74,74,.13); color:#e07a7a; border:1px solid rgba(216,74,74,.3);
  border-radius:7px; padding:3px 8px; font-size:10.5px; letter-spacing:.04em; white-space:nowrap;
}
.apc-marg{display:inline-block; min-width:46px; text-align:center; padding:3px 8px; border-radius:7px; font-size:11px; font-weight:500}
.apc-marg.m-ok{background:rgba(95,208,138,.14); color:#5fd08a}
.apc-marg.m-med{background:rgba(242,194,48,.15); color:#F2C230}
.apc-marg.m-mau{background:rgba(216,74,74,.14); color:#e07a7a}

/* accoes coladas a direita, lado a lado */
table.apc-tab th.apc-acol, table.apc-tab td.apc-acol{
  position:sticky; right:0; background:#0c0e12; border-left:1px solid #1d222b; z-index:4; text-align:right;
}
table.apc-tab thead tr.apc-faixas th.apc-acol{z-index:8; background:#11151d}
table.apc-tab thead tr.apc-cols th.apc-acol{z-index:8; background:#151922}
table.apc-tab tbody tr:nth-child(even) td.apc-acol{background:#0e1115}
table.apc-tab tbody tr:hover td.apc-acol{background:#141720}
table.apc-tab tbody tr.apc-incompleta td.apc-acol{background:#151013}
.apc-acts{display:flex; gap:6px; justify-content:flex-end; align-items:center; flex-wrap:nowrap}
.apc-b{
  border:1px solid #2b313c; background:#141922; color:#cfd5dd; border-radius:8px;
  padding:6px 11px; font-family:'Oswald',sans-serif; font-size:10.5px; font-weight:500;
  letter-spacing:.1em; cursor:pointer; text-transform:uppercase; text-decoration:none;
  white-space:nowrap; line-height:1.5;
}
.apc-b:hover{border-color:#F2C230; color:#F2C230}
.apc-b.del:hover{border-color:#d84a4a; color:#e07a7a}
.apc-b.mini{padding:5px 9px; font-size:9.5px; color:#9aa0a8}

/* bloco 208b — custo estimado pelo fator da marca, sempre distinto do real */
.apc-est{color:#F2C230}
.apc-est i{font-style:normal;font-size:9.5px;letter-spacing:.08em;opacity:.75;margin-left:3px}
.apc-luc.est{color:#d6b24a}
.apc-marg.m-est{background:rgba(242,194,48,.1);color:#d6b24a;border:1px dashed rgba(242,194,48,.35)}
table.apc-tab tbody tr.apc-estimada td.apc-fix{background:#0e0f0c}
table.apc-tab tbody tr.apc-estimada{background:rgba(242,194,48,.028)}
#adm-prod-kpis .apk-v.ambar{color:#d6b24a}

/* ======================================================================
   bloco 211 — o painel de administrador passa a usar o ecra todo
   O Braga (25/10/2026): "estas a ver que tem esse espacamento em branco em
   volta? Vais pegar nessa coluna das opcoes e encostar, e essa tabela vais
   abri-la e aproveitar todo esse espaco, porque eu nao quero nada de
   arrastar dentro do ecra. Se algum texto ficar muito pequeno, aumenta.
   Isto para todas as seccoes do administrador."
   Havia tres travoes a somar-se: .brand-page com ate 80px de cada lado,
   .section-body travada em 1100px e .adm-wrap travada em 1180px. Num ecra
   de 2000px sobravam ~400px de branco de cada lado e a tabela ficava com
   menos de mil de largura — dai ter de se arrastar para o lado.
   Aqui, a partir dos 1200px, os tres travoes saem no #cat-admin: a coluna
   das opcoes encosta a esquerda, o conteudo estica ate a direita e a tabela
   deixa de ter largura minima (passa a caber no espaco que agora existe em
   vez de obrigar a arrastar). Para a tabela caber sem encolher a letra,
   aperta-se o espacamento das celulas, nao o tamanho do texto — e acima dos
   1700px a letra ate cresce. Abaixo dos 1200px fica tudo como estava.
   ====================================================================== */
@media(min-width:1200px){
  /* 1. a pagina do painel deixa de ter a moldura branca de 80px */
  #cat-admin{ padding-left:18px !important; padding-right:18px !important }
  #cat-admin .section-body{ max-width:none !important; width:auto !important; margin:0 !important }
  /* 2. a coluna das opcoes encosta a esquerda e o resto vai ate a direita */
  #cat-admin .adm-wrap{
    max-width:none !important; width:auto !important; margin:0 !important;
    grid-template-columns:208px minmax(0,1fr) !important; gap:16px !important;
  }
  #cat-admin .adm-main{ min-width:0 !important; overflow:visible !important }
  #cat-admin .adm-side{ padding:14px !important }

  /* 3. todas as tabelas do painel aproveitam a largura e nao forcam arrasto */
  #cat-admin .adm-main table{ width:100% !important; max-width:none !important }
  #cat-admin .prod-table, #cat-admin .adm-table{ min-width:0 !important }
  #cat-admin .prod-table-wrap{ overflow-x:visible !important }
  #cat-admin .adm-card{ max-width:none !important }

  /* 4. a tabela de produtos e margens: sem largura minima, celulas apertadas
        (o texto fica do mesmo tamanho, so o espaco em volta e que diminui) */
  #cat-admin table.apc-tab{ min-width:0 !important; width:100% !important }
  #cat-admin table.apc-tab tbody td{ padding:10px 8px !important }
  #cat-admin table.apc-tab thead tr.apc-faixas th{ padding:9px 8px !important }
  #cat-admin table.apc-tab thead tr.apc-cols th{ padding:11px 8px !important }
  #cat-admin table.apc-tab td.apc-fix,
  #cat-admin table.apc-tab th.apc-fix{
    min-width:206px !important; max-width:none !important; padding-left:11px !important;
  }
  /* o nome do produto pode partir em duas linhas: e a coluna mais larga e e
     por causa dela que a tabela ainda nao cabia em ecras de 1366/1440 */
  #cat-admin table.apc-tab td.apc-fix{ white-space:normal !important }
  #cat-admin .apc-nome{ white-space:normal; display:block; line-height:1.3 }
  #cat-admin .apc-rolo{ max-height:74vh }
  /* os quatro botoes das accoes numa linha unica, nunca empilhados */
  #cat-admin .apc-acts{ flex-wrap:nowrap !important; gap:5px !important }
  #cat-admin .apc-acts .apc-b{ padding:5px 8px !important; white-space:nowrap }
}
/* ecras de portatil (1200-1550): o espaco e justo, por isso aperta-se mais o
   espacamento e deixa-se a classificacao partir de linha — assim a tabela
   cabe inteira tambem num 1366 ou 1440 e nao e preciso arrastar nada */
@media(min-width:1200px) and (max-width:1549px){
  #cat-admin table.apc-tab tbody td{ padding:9px 6px !important }
  #cat-admin table.apc-tab thead tr.apc-faixas th{ padding:9px 6px !important }
  #cat-admin table.apc-tab thead tr.apc-cols th{ padding:10px 6px !important }
  #cat-admin table.apc-tab td.apc-fix,
  #cat-admin table.apc-tab th.apc-fix{ min-width:178px !important; padding-left:9px !important }
  #cat-admin table.apc-tab tbody td:not(.apc-num):not(.apc-acol){ white-space:normal !important }
  #cat-admin .apc-acts .apc-b{ padding:5px 7px !important }
}
/* 1200-1420 (portateis de 13"/14"): ganha-se o resto da largura na coluna
   das opcoes e nas margens da pagina, para a tabela caber tambem aqui */
@media(min-width:1200px) and (max-width:1419px){
  #cat-admin{ padding-left:10px !important; padding-right:10px !important }
  #cat-admin .adm-wrap{ grid-template-columns:182px minmax(0,1fr) !important; gap:12px !important }
  #cat-admin .adm-side{ padding:11px !important }
  #cat-admin table.apc-tab td.apc-fix,
  #cat-admin table.apc-tab th.apc-fix{ min-width:164px !important }
}
/* 1200-1365 (o ecra mais apertado em que o painel ainda e "desktop"):
   o cabecalho das colunas parte de linha e a coluna das opcoes aperta mais,
   em vez de se mandar a tabela para o arrasto lateral */
@media(min-width:1200px) and (max-width:1365px){
  #cat-admin .adm-wrap{ grid-template-columns:140px minmax(0,1fr) !important; gap:10px !important }
  #cat-admin .apc-img{ width:40px !important; height:32px !important }
  #cat-admin .adm-side{ padding:9px !important }
  #cat-admin .adm-nav button{ padding-left:9px !important; padding-right:9px !important }
  #cat-admin table.apc-tab thead tr.apc-cols th{ white-space:normal !important; line-height:1.25 }
  #cat-admin table.apc-tab tbody td{ padding:9px 5px !important }
  #cat-admin table.apc-tab thead tr.apc-cols th{ padding:9px 5px !important }
  #cat-admin table.apc-tab td.apc-fix,
  #cat-admin table.apc-tab th.apc-fix{ min-width:152px !important }
  #cat-admin .apc-acts .apc-b{ padding:5px 6px !important }
}
/* ecras largos: sobra espaco, portanto o texto cresce e a coluna do
   produto respira — era o "se algum texto ficar muito pequeno, aumenta" */
@media(min-width:1820px){
  #cat-admin table.apc-tab{ font-size:14px }
  #cat-admin table.apc-tab tbody td{ padding:12px 13px !important }
  #cat-admin table.apc-tab thead tr.apc-cols th{ font-size:11px; padding:12px 13px !important }
  #cat-admin table.apc-tab thead tr.apc-faixas th{ font-size:10.5px; padding:10px 13px !important }
  #cat-admin table.apc-tab td.apc-fix,
  #cat-admin table.apc-tab th.apc-fix{ min-width:330px !important }
  #cat-admin .apc-nome{ font-size:14px }
  #cat-admin .apc-sku{ font-size:11.5px }
  #cat-admin #adm-prod-kpis .apk-v{ font-size:23px }
  #cat-admin #adm-prod-kpis .apk-t{ font-size:10.5px }
  #cat-admin .apk-falta{ font-size:13.5px }
  #cat-admin .apc-acts .apc-b{ padding:6px 10px !important }
}

/* ======================================================================
   bloco 213 — a faixa do topo no telemovel deixa de deixar ver o que
   passa por baixo dela
   O Braga (25/10/2026), com a fotografia do iPhone: "olha esse header com
   esses botoes sobre uma coisa em cima da outra. Que coisa feia!"
   A faixa (bloco 140) ja la estava, mas tinha duas falhas: o fundo era um
   gradiente a 97% em vez de solido, e tinha backdrop-filter:blur. O blur
   vai buscar o que esta por tras e, nos cantos, arrasta o branco da pagina
   para dentro da faixa — ficava com as pontas lavadas e deixava ler o
   letreiro ("MAKES COVERED / SHIPS DIRECT") por tras dos botoes.
   Agora: fundo solido ate onde os botoes acabam, so depois e que desvanece,
   e sem blur nenhum. Os botoes continuam por cima (Menu z10086, conta e
   carrinho z10002, faixa z10000), e nada passa a ver-se por tras deles.
   ====================================================================== */
#blp-hdr-band{
  background:linear-gradient(180deg,
      #07070a 0%,
      #07070a 74%,
      rgba(7,7,9,.86) 88%,
      rgba(7,7,9,0) 100%) !important;
  -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
  box-shadow:0 10px 26px -18px rgba(0,0,0,.95);
}

/* bloco 217b — notas da secção 4 do painel de pagamentos (bloco 216) */
#pay-panel .pay-note{
  font:400 12.5px Oswald,sans-serif; color:#9aa0a8; line-height:1.55;
  margin:9px 0 2px; padding:10px 12px;
  border-left:2px solid rgba(242,194,48,.45); background:rgba(255,255,255,.02); border-radius:0 9px 9px 0;
}
#pay-panel .pay-note b{color:#d6b24a}

/* ======================================================================
   bloco 218 — a barra do Expert Guide passa a ficar ao centro
   O Braga (25/10/2026): "aonde aparece o card ou list, eles estao mais
   para o lado esquerdo, esse botao ali no Guide Expert. Sera que podias
   centralizar tudo?"
   A barra tinha justify-content:space-between, o que atirava o Cards/List
   para a esquerda e as setas para a direita, com um rasgo vazio no meio.
   Agora os dois grupos ficam juntos e centrados, no computador, no tablet
   e no telemovel. Em ecra estreito partem para duas linhas, tambem ao
   centro, em vez de se espremerem.
   ====================================================================== */
#adv-app .adv-vista-bar,
#guia-saber .adv-vista-bar{
  justify-content:center !important;
  flex-wrap:wrap;
  gap:14px !important;
  text-align:center;
}
#adv-app .adv-vista-tog,
#guia-saber .adv-vista-tog{ margin:0 auto }
#adv-app .adv-vista-nav,
#guia-saber .adv-vista-nav{ justify-content:center }
@media(max-width:560px){
  #adv-app .adv-vista-bar,
  #guia-saber .adv-vista-bar{ flex-direction:column; gap:10px !important }
  #adv-app .adv-vista-tog,
  #guia-saber .adv-vista-tog{ width:auto }
}

/* bloco 224 — faltavam cores a estes estados: apareciam sem cor nenhuma */
.st-delivered{background:rgba(46,199,122,.18);color:#2ec77a}
.st-paid{background:rgba(46,199,122,.18);color:#2ec77a}
.st-unpaid{background:rgba(230,164,23,.18);color:#e6a417}
.st-pending{background:rgba(230,164,23,.18);color:#e6a417}
.st-cash{background:rgba(242,194,48,.16);color:#F2C230}
.st-crypto{background:rgba(242,194,48,.16);color:#F2C230}

/* bloco 228 — no kit do Tej, o que existe mas nao esta confirmado para o carro */
#tej-ov .tk-geral{opacity:.95}
#tej-ov .tk-porconf{color:#d6b24a;font-style:italic}
#tej-ov .tk-aviso9{color:#9aa0a8;font-size:12px;margin-top:8px;line-height:1.5}

/* ======================================================================
   bloco 230 — o piscar do ecra na abertura
   O Braga: "o site esta com muito bug de ficar piscando tela".
   Medido na abertura, com o contador do proprio browser:
       CLS 1,07 no computador e 0,75 no telemovel  (bom e abaixo de 0,1)
   e 1,05 desse valor vinha de UM so sitio: o brilho que passa por cima do
   logo no arranque. A animacao movia a propriedade "left", que obriga o
   browser a recalcular a posicao de tudo a cada fotograma — e foi isso que
   ele via como o ecra a tremer.
   A mesma animacao, feita com transform, corre na placa grafica e nao toca
   no desenho da pagina. Fica igual aos olhos e para de mexer no resto.
   ====================================================================== */
#blp-logo-splash .bls-shine{ contain:layout paint; }
#blp-logo-splash .bls-shine::before{
  left:-70% !important;
  transform:translateX(0) skewX(-18deg);
  will-change:transform;
  animation-name:blsShine2 !important;
}
@keyframes blsShine2{
  0%  { transform:translateX(0)    skewX(-18deg) }
  100%{ transform:translateX(524%) skewX(-18deg) }
}
/* o titulo do menu mudava de altura quando o texto traduzido dava duas
   linhas, e empurrava o carrossel para baixo: reserva-se a altura maior */
#capa .mm-title{ min-height:1.25em }


/* ======================================================================
   bloco 231 — as faixas de video deixam de ser descarregadas duas vezes
   Medido no computador: TURBOS_BANNER.mp4, 841 KB, pedido DUAS vezes numa
   so abertura. O travao larga o ficheiro assim que a faixa sai do ecra
   (40px de folga) e volta a busca-lo inteiro quando ela reaparece — basta
   um scroll para baixo e para cima.
   Nao se muda aqui o codigo; muda-se no blp.js (a folga para largar passa
   a ser generosa). Esta nota fica para quem ler o CSS saber porque.
   ====================================================================== */
