/* =========================================================
   Alfa Distribuidora — paleta extraída do logo
   ========================================================= */
:root {
  --alfa-navy: #05498a;       /* azul do "ALFA" */
  --alfa-deep: #0a1e4a;       /* azul-marinho profundo da onda */
  --alfa-ocean: #0b7fa0;      /* transição azul/verde */
  --alfa-teal: #13b59c;       /* verde-água do topo */
  --alfa-ink: #2a2e35;        /* cinza do "DISTRIBUIÇÃO" */
  --alfa-gradiente: linear-gradient(135deg, var(--alfa-deep) 0%, var(--alfa-navy) 45%, var(--alfa-ocean) 75%, var(--alfa-teal) 100%);

  --alfa-bg: #ffffff;
  --alfa-bg-alt: #f2f7fb;
  --alfa-surface: #ffffff;
  --alfa-borda: #dfe8f1;
  --alfa-texto: #1f2a37;
  --alfa-texto-suave: #5b6878;
  --alfa-titulo: var(--alfa-navy);
  --alfa-destaque: var(--alfa-teal);
  --alfa-sombra: 0 10px 30px rgba(5, 73, 138, .10);
  --alfa-nav-bg: rgba(255, 255, 255, .88);

  --bs-primary: var(--alfa-navy);
  --bs-primary-rgb: 5, 73, 138;
  --bs-link-color: var(--alfa-navy);
  --bs-link-hover-color: var(--alfa-teal);
  --bs-body-font-family: "Nunito", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

[data-bs-theme="dark"] {
  --alfa-bg: #0b1424;
  --alfa-bg-alt: #0f1b30;
  --alfa-surface: #13223b;
  --alfa-borda: #22385a;
  --alfa-texto: #e3ebf5;
  --alfa-texto-suave: #9fb1c7;
  --alfa-titulo: #ffffff;
  --alfa-destaque: #2fd3b6;
  --alfa-sombra: 0 10px 30px rgba(0, 0, 0, .35);
  --alfa-nav-bg: rgba(11, 20, 36, .88);

  --bs-body-bg: var(--alfa-bg);
  --bs-body-color: var(--alfa-texto);
  --bs-link-color: #5fb4ff;
  --bs-link-hover-color: var(--alfa-destaque);
}

html { scroll-behavior: smooth; scroll-padding-top: 80px; }

body {
  background: var(--alfa-bg);
  color: var(--alfa-texto);
  font-family: var(--bs-body-font-family);
  transition: background-color .3s ease, color .3s ease;
}

h1, h2, h3, h4, h5, h6 { font-weight: 800; }

.text-alfa-teal { color: var(--alfa-destaque) !important; }

/* ---------- Botões ---------- */
.btn-alfa {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--alfa-navy);
  --bs-btn-border-color: var(--alfa-navy);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #043b70;
  --bs-btn-hover-border-color: #043b70;
  --bs-btn-active-bg: #033261;
  --bs-btn-active-border-color: #033261;
  --bs-btn-active-color: #fff;
  font-weight: 700;
}
[data-bs-theme="dark"] .btn-alfa {
  --bs-btn-bg: var(--alfa-teal);
  --bs-btn-border-color: var(--alfa-teal);
  --bs-btn-color: #06241f;
  --bs-btn-hover-bg: #2fd3b6;
  --bs-btn-hover-border-color: #2fd3b6;
  --bs-btn-hover-color: #06241f;
  --bs-btn-active-bg: #0f9a85;
  --bs-btn-active-color: #06241f;
}

.btn-outline-alfa {
  --bs-btn-color: var(--alfa-navy);
  --bs-btn-border-color: var(--alfa-navy);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--alfa-navy);
  --bs-btn-hover-border-color: var(--alfa-navy);
  --bs-btn-active-bg: var(--alfa-navy);
  --bs-btn-active-color: #fff;
  font-weight: 700;
}
[data-bs-theme="dark"] .btn-outline-alfa {
  --bs-btn-color: var(--alfa-destaque);
  --bs-btn-border-color: var(--alfa-destaque);
  --bs-btn-hover-bg: var(--alfa-destaque);
  --bs-btn-hover-border-color: var(--alfa-destaque);
  --bs-btn-hover-color: #06241f;
  --bs-btn-active-bg: var(--alfa-destaque);
  --bs-btn-active-color: #06241f;
}

.btn-whats {
  --bs-btn-color: #fff;
  --bs-btn-bg: #25d366;
  --bs-btn-border-color: #25d366;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #1ebe5a;
  --bs-btn-hover-border-color: #1ebe5a;
  --bs-btn-active-bg: #19a84f;
  --bs-btn-active-color: #fff;
  font-weight: 800;
  box-shadow: 0 8px 20px rgba(37, 211, 102, .35);
}

.btn-icon {
  width: 40px; height: 40px;
  display: inline-grid; place-items: center;
  border-radius: 50%;
  border: 1px solid var(--alfa-borda);
  color: var(--alfa-titulo);
  background: transparent;
}
.btn-icon:hover { background: var(--alfa-bg-alt); color: var(--alfa-destaque); }

.link-alfa { color: var(--bs-link-color); font-weight: 700; text-decoration: none; }
.link-alfa:hover { color: var(--bs-link-hover-color); text-decoration: underline; }

/* ---------- Navbar ---------- */
.alfa-navbar {
  background: var(--alfa-nav-bg);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--alfa-borda);
  transition: box-shadow .3s ease, background-color .3s ease;
}
.alfa-navbar.rolou { box-shadow: var(--alfa-sombra); }
.brand-text { font-weight: 900; font-size: 1.25rem; color: var(--alfa-titulo); letter-spacing: -.01em; }
.alfa-navbar .nav-link { font-weight: 700; color: var(--alfa-texto-suave); padding-inline: .9rem !important; }
.alfa-navbar .nav-link:hover,
.alfa-navbar .nav-link.active { color: var(--alfa-destaque); }

@media (max-width: 575.98px) {
  .brand-text { display: none; }
}

/* ---------- Barra de admin ---------- */
.admin-bar {
  position: fixed; left: 0; right: 0; bottom: 0;
  z-index: 1030;
  padding: .6rem 0;
  padding-right: 90px;
  background: var(--alfa-gradiente);
  color: #fff;
  font-size: .9rem;
  box-shadow: 0 -6px 20px rgba(0, 0, 0, .15);
}

/* ---------- Hero ---------- */
.hero {
  position: relative;
  padding: 150px 0 140px;
  background:
    linear-gradient(135deg, rgba(3, 24, 38, 0.82), rgba(15, 97, 86, 0.72)),
    url("../../fundo.jpg") center/cover no-repeat;
  color: #fff;
  overflow: hidden;
}
.hero::before,
.hero::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  filter: blur(10px);
  pointer-events: none;
}
.hero::before { width: 480px; height: 480px; top: -160px; right: -120px; background: rgba(19, 181, 156, .30); }
.hero::after  { width: 380px; height: 380px; bottom: -160px; left: -120px; background: rgba(255, 255, 255, .08); }

.hero-badge {
  background: rgba(255, 255, 255, .15);
  border: 1px solid rgba(255, 255, 255, .3);
  font-weight: 700;
  font-size: .85rem;
  padding: .5rem .9rem;
  border-radius: 50rem;
}
.hero-title { font-size: clamp(2rem, 4.5vw, 3.4rem); font-weight: 900; line-height: 1.1; margin-bottom: 1.25rem; }
.hero-destaque { color: #7ff0d9; }
.hero-lead { font-size: 1.15rem; opacity: .92; max-width: 560px; margin: 0 auto 2rem; }
@media (min-width: 992px) { .hero-lead { margin-left: 0; } }

.hero-logo-wrap { position: relative; display: inline-block; animation: flutuar 6s ease-in-out infinite; }
.hero-logo {
  max-width: min(300px, 80vw);
  border-radius: 2rem;
  box-shadow: 0 30px 60px rgba(0, 0, 0, .35);
}
@keyframes flutuar {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-14px); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-logo-wrap { animation: none; }
  html { scroll-behavior: auto; }
}

.hero > .container { z-index: 1; }
.hero-onda { position: absolute; left: 0; bottom: -1px; width: 100%; height: 90px; z-index: 2; }
.hero-onda path { fill: var(--alfa-bg); transition: fill .3s ease; }

/* ---------- Seções ---------- */
.secao { padding: 90px 0; }
.secao-alt { background: var(--alfa-bg-alt); }
.secao-kicker {
  display: inline-block;
  color: var(--alfa-destaque);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .12em;
  font-size: .8rem;
  margin-bottom: .5rem;
}
.secao-titulo { color: var(--alfa-titulo); font-size: clamp(1.7rem, 3vw, 2.4rem); font-weight: 900; }
.secao-sub { color: var(--alfa-texto-suave); max-width: 620px; margin: .75rem auto 0; font-size: 1.05rem; }
.texto-corpo { color: var(--alfa-texto-suave); font-size: 1.05rem; }

/* Diferenciais */
.diferencial {
  background: var(--alfa-surface);
  border: 1px solid var(--alfa-borda);
  border-radius: 1.25rem;
  padding: 2rem 1.5rem;
  text-align: center;
  transition: transform .25s ease, box-shadow .25s ease;
}
.diferencial:hover { transform: translateY(-6px); box-shadow: var(--alfa-sombra); }
.diferencial-icone {
  width: 68px; height: 68px;
  margin: 0 auto 1.25rem;
  display: grid; place-items: center;
  border-radius: 1.1rem;
  background: var(--alfa-gradiente);
  color: #fff;
  font-size: 1.8rem;
}
.diferencial h3 { font-size: 1.15rem; color: var(--alfa-titulo); }
.diferencial p { color: var(--alfa-texto-suave); margin: 0; }

/* Cards de produtos */
.card-produto {
  background: var(--alfa-surface);
  border: 1px solid var(--alfa-borda);
  border-radius: 1.25rem;
  overflow: hidden;
  height: 100%;
  display: flex;
  flex-direction: column;
  transition: transform .25s ease, box-shadow .25s ease;
}
.card-produto:hover { transform: translateY(-6px); box-shadow: var(--alfa-sombra); }
.card-produto-midia {
  position: relative;
  aspect-ratio: 16 / 10;
  background: var(--alfa-gradiente);
  overflow: hidden;
}
.card-produto-midia img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s ease; }
.card-produto:hover .card-produto-midia img { transform: scale(1.05); }
.card-produto-placeholder {
  width: 100%; height: 100%;
  display: grid; place-items: center;
  color: rgba(255, 255, 255, .9);
  font-size: 4rem;
}
.card-produto-corpo { padding: 1.5rem; display: flex; flex-direction: column; flex: 1; }
.card-produto-corpo h3 { font-size: 1.25rem; color: var(--alfa-titulo); margin-bottom: .5rem; }
.card-produto-corpo p { color: var(--alfa-texto-suave); flex: 1; }
.card-produto-link { font-weight: 800; color: var(--alfa-destaque); text-decoration: none; }
.card-produto-link:hover { text-decoration: underline; color: var(--alfa-destaque); }

.badge-alterado {
  position: absolute; top: .75rem; left: .75rem;
  display: none;
}
body.modo-admin .badge-alterado { display: inline-block; }

.btn-editar-marca {
  position: absolute; top: .5rem; right: .5rem;
  display: none;
  font-weight: 700;
  box-shadow: 0 4px 10px rgba(0, 0, 0, .18);
}
body.modo-admin .btn-editar-marca { display: inline-flex; align-items: center; gap: .35rem; }
body.modo-admin .marca { outline: 2px dashed var(--alfa-destaque); outline-offset: 4px; }
.badge-alterado-marca {
  position: absolute; top: .5rem; left: .5rem;
  display: none;
}
body.modo-admin .badge-alterado-marca { display: inline-block; }

/* Marcas (carrossel contínuo) */
/* Padrão (sem JS ou com movimento reduzido): grade centralizada */
.marcas-carrossel { overflow: hidden; padding: .75rem 0; }
.marcas-trilha {
  list-style: none;
  margin: 0 auto; padding: 0 16px;
  max-width: 1320px;
  display: flex; flex-wrap: wrap; justify-content: center;
  gap: 1.25rem;
}
/* Com JS (app.js adiciona .animado): faixa rolando em loop */
.marcas-carrossel.animado {
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.marcas-carrossel.animado .marcas-trilha {
  flex-wrap: nowrap;
  gap: 0;
  padding: 0;
  max-width: none;
  width: max-content;
  animation: rolarMarcas 60s linear infinite;
}
.marcas-carrossel.animado .marca { margin-right: 1.25rem; } /* margem (não gap) para o loop de -50% fechar exato */
.marcas-carrossel.animado:hover .marcas-trilha { animation-play-state: paused; }
.marca {
  flex-shrink: 0;
  width: 150px; height: 150px;
  padding: .75rem;
  display: grid; place-items: center;
  background: #fff;             /* branco também no modo noturno: logos com fundo branco */
  border: 1px solid var(--alfa-borda);
  border-radius: 1.25rem;
  transition: transform .25s ease, box-shadow .25s ease;
}
.marca:hover { transform: translateY(-4px); box-shadow: var(--alfa-sombra); }
.marca img { width: 100%; height: 100%; object-fit: contain; border-radius: .75rem; }
@keyframes rolarMarcas {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
@media (max-width: 575.98px) {
  .marcas-trilha { gap: .9rem; }
  .marca { width: 110px; height: 110px; padding: .5rem; }
  .marcas-carrossel.animado .marca { margin-right: .9rem; }
}

/* Sobre */
.lista-check { list-style: none; padding: 0; margin: 1.5rem 0 0; display: grid; gap: .75rem; }
.lista-check li { display: flex; align-items: center; gap: .6rem; font-weight: 700; }
.lista-check i { color: var(--alfa-destaque); font-size: 1.2rem; }

.card-empresa,
.card-contato {
  background: var(--alfa-surface);
  border: 1px solid var(--alfa-borda);
  border-radius: 1.5rem;
  padding: 2rem;
  box-shadow: var(--alfa-sombra);
}
.dados-empresa dt { font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; color: var(--alfa-texto-suave); font-weight: 700; }
.dados-empresa dd { font-size: 1.1rem; font-weight: 700; margin-bottom: 1rem; overflow-wrap: anywhere; }
.dados-empresa dd:last-child { margin-bottom: 0; }

/* CTA */
.cta { background: var(--alfa-gradiente); color: #fff; padding: 80px 0; }
.cta-grid { min-height: 100%; }
.cta-titulo { font-weight: 900; font-size: clamp(1.6rem, 3vw, 2.3rem); margin-bottom: 1rem; }
.cta-subtitulo { font-weight: 800; font-size: clamp(1.2rem, 2.5vw, 1.5rem); margin-bottom: .9rem; }
.cta-texto { opacity: .9; font-size: 1.1rem; margin-bottom: 1.75rem; }
.cta-visual {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 1.5rem;
  padding: 0.5rem;
  box-shadow: 0 18px 40px rgba(6, 13, 26, 0.18);
  min-height: 100%;
}
.cta-mapa-titulo {
  font-size: clamp(1.1rem, 2vw, 1.5rem);
  font-weight: 800;
  margin: 0 0 0.5rem;
  text-align: center;
  color: #fff;
}
.cta-mapa {
  width: 100%;
  min-height: 420px;
  height: 420px;
  display: block;
  border: 0;
  border-radius: 1rem;
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.18);
}

/* Localização */
.mapa-wrap {
  border-radius: 1.5rem;
  overflow: hidden;
  border: 1px solid var(--alfa-borda);
  box-shadow: var(--alfa-sombra);
  height: 100%;
  min-height: 380px;
}
.mapa-wrap iframe { width: 100%; height: 100%; min-height: 380px; border: 0; display: block; }
[data-bs-theme="dark"] .mapa-wrap iframe { filter: invert(.9) hue-rotate(180deg) saturate(.8); }

.contato-item { display: flex; gap: 1rem; align-items: flex-start; margin-bottom: 1.25rem; }
.contato-item > i {
  width: 44px; height: 44px; flex-shrink: 0;
  display: grid; place-items: center;
  border-radius: .8rem;
  background: var(--alfa-bg-alt);
  color: var(--alfa-destaque);
  font-size: 1.2rem;
}
.contato-rotulo { font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; color: var(--alfa-texto-suave); font-weight: 700; }

/* Rodapé */
.rodape { background: var(--alfa-deep); color: #fff; padding: 40px 0 100px; }
[data-bs-theme="dark"] .rodape { background: #060d1a; }
.rodape-link { color: #7ff0d9; font-weight: 800; text-decoration: none; }
.rodape-link:hover { color: #fff; }

/* Botão flutuante WhatsApp */
.whats-float {
  position: fixed; right: 22px; bottom: 22px;
  z-index: 1040;
  width: 62px; height: 62px;
  border-radius: 50%;
  display: grid; place-items: center;
  background: #25d366;
  color: #fff;
  font-size: 2rem;
  text-decoration: none;
  box-shadow: 0 10px 25px rgba(37, 211, 102, .45);
  transition: transform .2s ease;
}
.whats-float::before {
  content: "";
  position: absolute; inset: 0;
  border-radius: 50%;
  background: #25d366;
  z-index: -1;
  animation: pulsar 2.2s ease-out infinite;
}
.whats-float:hover { transform: scale(1.08); color: #fff; }
@keyframes pulsar {
  0% { transform: scale(1); opacity: .6; }
  100% { transform: scale(1.7); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) { .whats-float::before { animation: none; } }

/* Modal de imagem */
.preview-imagem {
  aspect-ratio: 16 / 10;
  border-radius: 1rem;
  overflow: hidden;
  background: var(--alfa-gradiente);
  display: grid; place-items: center;
  color: #fff;
  font-size: 3.5rem;
}
.preview-imagem img { width: 100%; height: 100%; object-fit: cover; }

.modal-content { border-radius: 1.25rem; background: var(--alfa-surface); }

/* Toast */
.toast.toast-sucesso { background: var(--alfa-teal); color: #06241f; }
.toast.toast-erro { background: #dc3545; color: #fff; }
.toast.toast-info { background: var(--alfa-navy); color: #fff; }

/* =========================================================
   Catálogo de produtos (assets/js/catalogo.js)
   ========================================================= */

/* Categorias (página inicial) */
.categoria-card {
  width: 100%; height: 100%;
  display: flex; flex-direction: column;
  padding: 0;
  text-align: left;
  background: var(--alfa-surface);
  border: 1px solid var(--alfa-borda);
  border-radius: 1.25rem;
  overflow: hidden;
  color: inherit;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.categoria-card:hover,
.categoria-card:focus-visible { transform: translateY(-6px); box-shadow: var(--alfa-sombra); border-color: var(--alfa-destaque); }
.categoria-card:focus-visible { outline: 3px solid var(--alfa-destaque); outline-offset: 2px; }
.categoria-capa {
  position: relative;
  display: block;
  aspect-ratio: 4 / 3;
  background: #fff;
  overflow: hidden;
}
.categoria-capa img { width: 100%; height: 100%; object-fit: contain; padding: .75rem; transition: transform .4s ease; }
.categoria-card:hover .categoria-capa img { transform: scale(1.06); }
.categoria-icone {
  position: absolute; left: .75rem; bottom: .75rem;
  width: 40px; height: 40px;
  display: grid; place-items: center;
  border-radius: .8rem;
  background: var(--alfa-gradiente);
  color: #fff;
  font-size: 1.15rem;
  box-shadow: 0 6px 14px rgba(5, 73, 138, .3);
}
.categoria-corpo { display: flex; flex-direction: column; gap: .25rem; padding: 1rem 1.1rem 1.15rem; flex: 1; }
.categoria-titulo { font-weight: 800; font-size: 1.05rem; line-height: 1.25; color: var(--alfa-titulo); }
.categoria-qtd { margin-top: auto; font-size: .85rem; font-weight: 700; color: var(--alfa-destaque); }
.categoria-qtd i { transition: transform .2s ease; display: inline-block; }
.categoria-card:hover .categoria-qtd i { transform: translateX(4px); }
@media (max-width: 575.98px) {
  .categoria-titulo { font-size: .95rem; }
  .categoria-corpo { padding: .8rem .85rem .9rem; }
}

.modal-categoria-icone {
  width: 44px; height: 44px; flex-shrink: 0;
  display: grid; place-items: center;
  border-radius: .9rem;
  background: var(--alfa-gradiente);
  color: #fff;
  font-size: 1.25rem;
}
#modalCategoria .modal-body { background: var(--alfa-bg-alt); }

/* Card de produto */
.produto {
  height: 100%;
  display: flex; flex-direction: column;
  background: var(--alfa-surface);
  border: 1px solid var(--alfa-borda);
  border-radius: 1rem;
  padding: .75rem;
  transition: box-shadow .25s ease, border-color .25s ease;
}
.produto:hover { box-shadow: var(--alfa-sombra); }
.produto-foto {
  aspect-ratio: 1;
  display: grid; place-items: center;
  background: #fff;
  border-radius: .75rem;
  overflow: hidden;
  margin-bottom: .75rem;
}
.produto-foto img { width: 100%; height: 100%; object-fit: contain; }
.produto-foto-vazia {
  background: var(--alfa-bg-alt);
  color: var(--alfa-texto-suave);
  font-size: 2.4rem;
  gap: .25rem;
  align-content: center;
}
.produto-foto-vazia span { font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.produto-nome {
  font-size: .92rem;
  font-weight: 800;
  line-height: 1.3;
  color: var(--alfa-titulo);
  text-align: center;
  margin: 0;
  flex: 1;
}

/* Página produtos.html */
.catalogo-hero {
  padding: 130px 0 60px;
  background: var(--alfa-gradiente);
  color: #fff;
}
.catalogo-hero h1 { font-weight: 900; font-size: clamp(1.9rem, 4vw, 2.8rem); }
.catalogo-hero p { opacity: .92; font-size: 1.05rem; max-width: 640px; }
.catalogo-busca { max-width: 560px; }
.catalogo-busca .form-control { border: 0; padding-left: 3rem; height: 54px; border-radius: 50rem; font-weight: 600; }
.catalogo-busca .bi-search { position: absolute; left: 1.2rem; top: 50%; transform: translateY(-50%); color: #5b6878; z-index: 5; }

.catalogo-filtros-wrap {
  position: sticky; top: 70px;
  z-index: 1020;
  background: var(--alfa-nav-bg);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--alfa-borda);
}
.catalogo-filtros-slider {
  position: relative;
  padding: 0 2.4rem;
}
.catalogo-filtros {
  display: flex;
  flex-wrap: nowrap;
  gap: .55rem;
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding: .75rem 0;
  scroll-behavior: smooth;
}
.catalogo-filtros::-webkit-scrollbar { display: none; }
.catalogo-filtros-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  width: 38px; height: 38px;
  border: 1px solid var(--alfa-borda);
  border-radius: 50%;
  background: rgba(255, 255, 255, .92);
  color: var(--alfa-navy);
  display: grid; place-items: center;
  box-shadow: var(--alfa-sombra);
  transition: opacity .2s ease, transform .2s ease;
}
.catalogo-filtros-nav:hover:not(:disabled) { transform: translateY(-50%) scale(1.05); }
.catalogo-filtros-nav:disabled { opacity: .35; cursor: not-allowed; }
.catalogo-filtros-prev { left: 0; }
.catalogo-filtros-next { right: 0; }
.filtro-chip {
  flex: 0 0 auto;
  min-width: 110px;
  max-width: none;
  display: inline-flex; align-items: center; justify-content: center; gap: .4rem;
  padding: .5rem .9rem;
  border: 1px solid var(--alfa-borda);
  border-radius: .8rem;
  background: var(--alfa-surface);
  color: var(--alfa-texto);
  font-weight: 700;
  font-size: .76rem;
  line-height: 1.2;
  white-space: nowrap;
  text-align: center;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
}
.filtro-chip i { flex-shrink: 0; }
.filtro-chip span { display: none; }
.filtro-chip:hover { border-color: var(--alfa-destaque); color: var(--alfa-destaque); transform: translateY(-1px); }
.filtro-chip.ativo { background: var(--alfa-navy); border-color: var(--alfa-navy); color: #fff; }
[data-bs-theme="dark"] .filtro-chip.ativo { background: var(--alfa-teal); border-color: var(--alfa-teal); color: #06241f; }

.catalogo-secao { scroll-margin-top: 150px; margin-bottom: 3rem; }
.catalogo-secao-titulo {
  display: flex; align-items: center; flex-wrap: wrap; gap: .6rem;
  font-size: 1.35rem;
  color: var(--alfa-titulo);
  margin-bottom: 1.25rem;
}
.catalogo-secao-titulo i {
  width: 38px; height: 38px;
  display: grid; place-items: center;
  border-radius: .75rem;
  background: var(--alfa-gradiente);
  color: #fff;
  font-size: 1.05rem;
}
.catalogo-secao-titulo small { font-size: .85rem; font-weight: 700; color: var(--alfa-texto-suave); }