/* =========================================================
   ÔNIX CREDIT — CAMADA MOBILE (até 767px)
   Carregada depois de todos os CSS do tema. Não altera o desktop.
   ========================================================= */
@media (max-width: 767px) {
  :root { --onix-navy:#0a3563; --onix-navy-2:#062447; --onix-orange:#f29a03; --onix-ink:#1f2933; --onix-muted:#5b6770; --onix-line:#e3e7ea; --onix-bg:#f4f6f7; }

  html, body { overflow-x:hidden; -webkit-text-size-adjust:100%; }
  body, body.responsive { background:#fff !important; font-size:16px; padding:0 !important; margin:0 !important; }
  body .bg-shadow #wrapper.container { margin:0 !important; width:100% !important; }
  .bg-shadow, #wrapper { width:100% !important; max-width:100% !important; margin:0 !important; padding:0 !important; box-shadow:none !important; }

  /* Grade fluida: sem larguras fixas nem margens negativas */
  .container, #wrapper .container { width:auto !important; max-width:100% !important; padding-left:16px !important; padding-right:16px !important; margin:0 !important; box-sizing:border-box; }
  .row, .row-fluid { margin-left:0 !important; margin-right:0 !important; width:auto !important; }
  [class*="span"] { float:none !important; width:auto !important; margin-left:0 !important; display:block; box-sizing:border-box; }
  img, iframe, video, table { max-width:100% !important; }
  img { height:auto; }
  [style*="width:600px"], [style*="width: 600px"] { width:auto !important; height:auto !important; overflow:visible !important; }

  /* ---------- Cabeçalho mobile ---------- */
  html.onix-m #topbar,
  html.onix-m #menu,
  html.onix-m .menu-select,
  html.onix-m select.mnav,
  html.onix-m #border-header { display:none !important; }

  html.onix-m #header { position:sticky; top:0; z-index:1000; background:#fff !important; border-bottom:1px solid var(--onix-line); box-shadow:0 2px 10px rgba(6,36,71,.06); padding:0 !important; margin:0 !important; height:auto !important; }
  html.onix-m #header > .container { padding-top:0 !important; padding-bottom:0 !important; }
  html.onix-m #header .span12, html.onix-m #header .row { display:block; }
  html.onix-m #logo { display:flex !important; align-items:center; height:64px; margin:0 !important; padding:0 !important; text-align:left !important; }
  html.onix-m #header { height:64px !important; min-height:0 !important; overflow:visible !important; }
  html.onix-m #logo a { display:inline-block !important; width:auto !important; text-align:left !important; }
  html.onix-m #logo img { height:48px !important; width:auto !important; max-width:none !important; margin:0 !important; }

  .onix-burger { position:absolute; right:8px; top:8px; width:48px; height:48px; border:0; background:transparent; border-radius:10px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; cursor:pointer; -webkit-tap-highlight-color:transparent; }
  .onix-burger span { display:block; width:24px; height:2px; background:var(--onix-navy); border-radius:2px; transition:transform .25s, opacity .2s; }
  .onix-burger:focus-visible { outline:2px solid var(--onix-orange); outline-offset:2px; }
  html.onix-menu-open .onix-burger span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
  html.onix-menu-open .onix-burger span:nth-child(2){ opacity:0; }
  html.onix-menu-open .onix-burger span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

  .onix-drawer { position:fixed; left:0; right:0; top:65px; bottom:0; z-index:999; background:#fff; overflow-y:auto; -webkit-overflow-scrolling:touch; transform:translateY(-8px); opacity:0; visibility:hidden; transition:opacity .2s, transform .2s, visibility .2s; padding:8px 0 calc(24px + env(safe-area-inset-bottom)); }
  html.onix-menu-open .onix-drawer { opacity:1; visibility:visible; transform:none; }
  html.onix-menu-open body { overflow:hidden; }
  .onix-drawer ul { list-style:none; margin:0; padding:0; }
  .onix-drawer li a { display:flex; align-items:center; justify-content:space-between; min-height:54px; padding:0 20px; font:500 17px/1.2 "Maven Pro", Arial, sans-serif; color:var(--onix-ink); text-decoration:none; border-bottom:1px solid var(--onix-line); }
  .onix-drawer li a::after { content:"›"; font-size:22px; color:#9aa5ad; }
  .onix-drawer li.sub a { padding-left:36px; font-size:15px; color:var(--onix-muted); min-height:48px; }
  .onix-drawer li.current a { color:var(--onix-navy); font-weight:700; box-shadow:inset 4px 0 0 var(--onix-orange); }
  .onix-drawer .onix-cta { display:block; margin:20px 20px 0; padding:15px; text-align:center; border-radius:10px; background:var(--onix-navy); color:#fff !important; font:600 16px "Maven Pro", Arial, sans-serif; text-decoration:none; }
  .onix-drawer .onix-cta::after { content:none; }
  .onix-drawer .onix-contact { margin:20px; font-size:14px; color:var(--onix-muted); line-height:1.7; }
  .onix-drawer .onix-contact a { color:var(--onix-navy); text-decoration:none; font-weight:600; }

  /* ---------- Banners / slider ---------- */
  #slider-revolution-slider, .slider, .shadowWrapper { margin:0 !important; padding:0 !important; }
  #page-meta { display:none !important; }

  /* ---------- Conteúdo ---------- */
  #primary { padding:24px 0 8px !important; margin:0 !important; }
  #primary .content, #content, #content-home { padding:0 !important; margin:0 !important; }
  #primary p, #primary li, #primary td { font-size:16px !important; line-height:1.65 !important; color:var(--onix-ink) !important; }
  #primary h1, #primary h2, #primary h3 { color:var(--onix-navy) !important; line-height:1.25 !important; letter-spacing:0 !important; word-wrap:break-word; }
  #primary h1 { font-size:28px !important; margin:0 0 16px !important; }
  #primary h2 { font-size:23px !important; margin:24px 0 12px !important; }
  #primary h3 { font-size:20px !important; margin:24px 0 10px !important; }
  #primary a { word-break:break-word; }
  .clear, br.clear { height:0 !important; }

  /* Tabelas (Suporte) empilhadas */
  #primary table, #primary tbody, #primary tr, #primary td { display:block; width:100% !important; }

  /* Lista de tutoriais / downloads: alvos de toque grandes */
  #primary a[href$=".pdf"], #primary a[href$=".exe"] { display:flex !important; align-items:center; min-height:48px; padding:8px 12px; margin:0 0 8px; background:var(--onix-bg); border:1px solid var(--onix-line); border-radius:10px; }
  #primary a[href$=".pdf"] img, #primary a[href$=".exe"] img { width:auto !important; max-height:30px; }

  /* ---------- Cards da página inicial ---------- */
  #portfolio.slide-detail { margin:0 !important; padding:0 !important; display:grid; grid-template-columns:1fr; gap:14px; }
  #portfolio.slide-detail > li { margin:0 !important; padding:0 !important; height:auto !important; width:auto !important; list-style:none; }
  #portfolio.slide-detail > li:not(:has(.ch-item)), #portfolio.slide-detail > hr { display:none !important; }
  #content-home .box-title { display:none !important; }
  #portfolio .ch-item-hover:hover { border-color:var(--onix-line) !important; }
  #portfolio.slide-detail .slide_detail { display:none !important; }
  html.onix-m body.responsive #portfolio.detail .ch-item { width:100% !important; height:160px !important; box-sizing:border-box; border-radius:14px !important; border:1px solid var(--onix-line) !important; box-shadow:0 2px 8px rgba(6,36,71,.06) !important; background-size:cover !important; background-position:center !important; background-color:#fff !important; cursor:pointer; overflow:hidden; }
  #portfolio .ch-info { opacity:1 !important; transform:none !important; border-radius:0 !important; height:auto !important; top:auto !important; bottom:0; background:transparent !important; box-shadow:none !important; }
  #portfolio .ch-info-icons { display:none !important; }
  #portfolio .ch-info-text { position:absolute; inset:0; }
  #portfolio .ch-info .subtitle { display:none !important; }

  /* ---------- Contato ---------- */
  #map iframe { height:240px !important; width:100% !important; }
  #map-handler { display:none !important; }

  /* ---------- Rodapé ---------- */
  #footer { padding:28px 0 !important; margin:0 !important; background:var(--onix-bg) !important; border-top:1px solid var(--onix-line); }
  #footer h3 { font-size:18px !important; color:var(--onix-navy) !important; margin:0 0 12px !important; }
  #footer .sidebar-nav, #footer .sidebar-nav ul { font-size:15px !important; line-height:1.75 !important; color:var(--onix-ink) !important; padding:0 !important; margin:0 !important; }
  #footer a, #primary .sidebar-nav a[href^="tel:"], #primary .sidebar-nav a[href^="mailto:"] { display:inline !important; padding:0 !important; margin:0 !important; height:auto !important; line-height:inherit !important; font-size:inherit !important; background:none !important; border:0 !important; color:var(--onix-navy) !important; font-weight:600; text-decoration:none !important; }
  #copyright { padding:18px 0 calc(84px + env(safe-area-inset-bottom)) !important; margin:0 !important; }
  #copyright .left:empty { display:none !important; }
  #copyright p, #copyright .lf { float:none !important; text-align:left !important; font-size:13px !important; margin:10px 0 0 !important; }
  #copyright .socials-small { margin-right:10px !important; transform:scale(1.35); transform-origin:left center; }

  /* ---------- Barra de ações fixa ---------- */
  .onix-actionbar { position:fixed; left:0; right:0; bottom:0; z-index:998; display:grid; grid-template-columns:repeat(3,1fr); background:#fff; border-top:1px solid var(--onix-line); box-shadow:0 -4px 16px rgba(6,36,71,.08); padding:6px 8px calc(6px + env(safe-area-inset-bottom)); }
  .onix-actionbar a { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; min-height:52px; border-radius:10px; font:600 12px "Maven Pro", Arial, sans-serif; color:var(--onix-navy) !important; text-decoration:none; }
  .onix-actionbar a svg { width:22px; height:22px; stroke:currentColor; fill:none; stroke-width:1.8; }
  .onix-actionbar a.primary { background:var(--onix-navy); color:#fff !important; margin-left:4px; }
  html.onix-menu-open .onix-actionbar { display:none; }
}

@media (min-width: 768px) {
  .onix-burger, .onix-drawer, .onix-actionbar { display:none !important; }
}
