/* ═══════════════════════════════════════════════════════════════
   ULTRA DISTRIBUIDORA — Manual de Identidade Visual (julho/2024)
   Cores oficiais:
     Ciano  #2cc3e8  RGB(44,195,232)  PANTONE 637 C
     Navy   #0a4e9b  RGB(10,78,155)   PANTONE 7686 C
   Tipografia: Gotham (primária) · Poppins (alternativa digital)
════════════════════════════════════════════════════════════════ */

/* ── Gotham @font-face ────────────────────────────────────────── */
@font-face {
  font-family: 'Gotham';
  src: url('../fonts/gotham/Gotham-Light.otf') format('opentype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Gotham';
  src: url('../fonts/gotham/Gotham-Book.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Gotham';
  src: url('../fonts/gotham/Gotham-Medium.otf') format('opentype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Gotham';
  src: url('../fonts/gotham/Gotham-Bold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Gotham';
  src: url('../fonts/gotham/Gotham-Black.otf') format('opentype');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

/* ── Variáveis de Marca (valores do manual oficial) ───────────── */
:root {
  /* Cores oficiais Ultra Distribuidora */
  --ultra-navy:      #0a4e9b;          /* PANTONE 7686 C — fundos escuros */
  --ultra-navy-rgb:  10, 78, 155;
  --ultra-cyan:      #2cc3e8;          /* PANTONE 637 C — destaques/ação */
  --ultra-cyan-rgb:  44, 195, 232;
  --ultra-cyan-dark: #1a9bb5;          /* ciano escurecido para hover */

  /* Override do tema Around/Bootstrap */
  --ar-primary:     #0a4e9b;
  --ar-primary-rgb: 10, 78, 155;
  --ar-info:        #2cc3e8;
  --ar-info-rgb:    44, 195, 232;

  /* Tipografia: Gotham (primária) · Poppins (alternativa digital) */
  --ar-body-font-family:     'Gotham', 'Poppins', sans-serif;
  --ar-headings-font-family: 'Gotham', 'Poppins', sans-serif;
}

/* ── Aplicar Gotham globalmente ───────────────────────────────── */
body,
.navbar,
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.btn, input, textarea, select, .form-control {
  font-family: 'Gotham', 'Poppins', sans-serif !important;
}

/* Títulos em caixa alta com tracking (conforme manual) */
h1, h2, .h1, .h2,
.display-1, .display-2, .display-3, .display-4 {
  letter-spacing: .02em;
}

/* ── Gradiente de Marca ───────────────────────────────────────── */
.bg-ultra-gradient {
  background: linear-gradient(135deg, #0a4e9b 0%, #1680c4 55%, #2cc3e8 100%) !important;
}

/* ── Padrão de pontos no hero ────────────────────────────────── */
.hero-bg-pattern::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgba(255,255,255,.08) 1px, transparent 1px);
  background-size: 28px 28px;
  pointer-events: none;
  z-index: 1;
}

/* ── Logo navbar ─────────────────────────────────────────────── */
.navbar-logo {
  max-height: 52px !important;
  width: auto !important;
}
@media (max-width: 991.98px) {
  .navbar-logo {
    max-height: 28px !important;
  }
}

/* ── Navbar ──────────────────────────────────────────────────── */
.navbar.bg-primary {
  background-color: var(--ultra-navy) !important;
  padding-top: .75rem !important;
  padding-bottom: .75rem !important;
}
.navbar.navbar-stuck {
  background-color: rgba(10, 78, 155, 0.95) !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  box-shadow: 0 1px 24px rgba(10,78,155,.4);
}
.navbar .navbar-collapse {
  background-color: transparent !important;
}
.navbar .nav-item:hover > .nav-link:not(.disabled),
.navbar .nav-item .nav-link.show:not(.disabled) {
  color: var(--ultra-cyan) !important;
}
.navbar .nav-link {
  font-weight: 500;
  font-size: .84rem;
  letter-spacing: 0;
}

/* ── Botões ──────────────────────────────────────────────────── */
.btn-info,
.btn-info:hover {
  background-color: var(--ultra-cyan) !important;
  border-color: var(--ultra-cyan) !important;
  color: #fff !important;
}
.btn-info:hover {
  background-color: var(--ultra-cyan-dark) !important;
  border-color: var(--ultra-cyan-dark) !important;
}
.btn-outline-info {
  border-color: var(--ultra-cyan) !important;
  color: var(--ultra-cyan) !important;
}
.btn-outline-info:hover {
  background-color: var(--ultra-cyan) !important;
  color: #fff !important;
}
.btn-primary {
  background-color: var(--ultra-navy) !important;
  border-color: var(--ultra-navy) !important;
}
.btn-primary:hover {
  background-color: #0d5fb8 !important;
  border-color: #0d5fb8 !important;
}

/* ── Cores de fundo ──────────────────────────────────────────── */
.bg-primary { background-color: var(--ultra-navy) !important; }
.bg-info     { background-color: var(--ultra-cyan) !important; }
/* Preserve semi-transparent tint when combined with bg-opacity-* */
.bg-info.bg-opacity-10 { background-color: rgba(44,195,232,.1) !important; }
.bg-info.bg-opacity-25 { background-color: rgba(44,195,232,.25) !important; }

/* ── Textos ──────────────────────────────────────────────────── */
.text-info    { color: var(--ultra-cyan) !important; }
.text-primary { color: var(--ultra-navy) !important; }

/* ── Bordas ──────────────────────────────────────────────────── */
.border-info    { border-color: var(--ultra-cyan) !important; }
.border-primary { border-color: var(--ultra-navy) !important; }

/* ── Badges / pills ─────────────────────────────────────────── */
.badge.bg-info    { background-color: var(--ultra-cyan) !important; }
.badge.bg-primary { background-color: var(--ultra-navy) !important; }

/* ── Filtros de distribuições ────────────────────────────────── */
.brand-filter-btn {
  font-family: 'Gotham', 'Poppins', sans-serif;
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .04em;
  padding: .5rem 1.4rem;
  border-radius: 50px;
  border: 2px solid #dde3ec;
  background: #fff;
  color: #6c757d;
  cursor: pointer;
  transition: all .2s ease;
}
.brand-filter-btn:hover {
  border-color: var(--ultra-cyan);
  color: var(--ultra-navy);
}
.brand-filter-btn.active {
  background: var(--ultra-navy);
  border-color: var(--ultra-navy);
  color: #fff;
}

/* ── Cards de marcas (novo layout) ──────────────────────────── */
.brand-card {
  display: flex;
  align-items: center;
  gap: 1rem;
  background: #fff;
  border-radius: 14px;
  padding: 1rem 1.1rem;
  box-shadow: 0 2px 12px rgba(10,78,155,.07);
  border: 1.5px solid transparent;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  height: 100%;
  position: relative;
}
.brand-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 28px rgba(10,78,155,.13);
  border-color: var(--ultra-cyan);
}
.brand-card-logo {
  flex-shrink: 0;
  width: 72px;
  height: 72px;
  background: #f4f7fb;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px;
}
.brand-card-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: none !important;
}
a.brand-card-logo {
  text-decoration: none;
  transition: opacity .2s ease;
}
a.brand-card-logo:hover {
  opacity: .75;
}
.brand-card-info {
  flex: 1;
  min-width: 0;
}
.brand-card-info h6 {
  font-size: .9rem;
  font-weight: 700;
  color: var(--ultra-navy);
  margin-bottom: .15rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.brand-card-info span {
  font-size: .75rem;
  color: #7a8ea8;
  display: block;
  margin-bottom: .4rem;
}
.brand-card-links {
  display: flex;
  flex-direction: column;
  gap: .3rem;
}
.brand-link-site,
.brand-link-ig {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  font-size: .72rem;
  font-weight: 600;
  text-decoration: none;
  padding: .25rem .65rem;
  border-radius: 50px;
  transition: background .2s, color .2s;
  width: fit-content;
}
.brand-link-site {
  background: rgba(10,78,155,.08);
  color: var(--ultra-navy);
}
.brand-link-site:hover {
  background: var(--ultra-navy);
  color: #fff;
}
.brand-link-ig {
  background: rgba(44,195,232,.12);
  color: #555;
}
.brand-link-ig:hover {
  background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
  color: #fff;
}

/* ── Cards de marcas ─────────────────────────────────────────── */
.ultra-brand-card {
  transition: transform .3s ease, box-shadow .3s ease;
}
.ultra-brand-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 12px 36px rgba(44,195,232,.22) !important;
}
.ultra-brand-card img {
  display: block !important;
  margin: 0 auto !important;
  width: 100% !important;
  max-width: 150px !important;
  height: 64px !important;
  object-fit: contain !important;
  filter: grayscale(20%);
  transition: filter .3s ease;
}
.ultra-brand-card:hover img {
  filter: grayscale(0%);
}

/* ── Leaflet map ─────────────────────────────────────────────── */
.leaflet-popup-content-wrapper {
  border-radius: 12px !important;
  box-shadow: 0 4px 20px rgba(10,78,155,.2) !important;
}

/* ── Formulários ─────────────────────────────────────────────── */
.form-control:focus,
.form-select:focus {
  border-color: var(--ultra-cyan) !important;
  box-shadow: 0 0 0 .2rem rgba(44,195,232,.25) !important;
}
.form-check-input:checked {
  background-color: var(--ultra-navy) !important;
  border-color: var(--ultra-navy) !important;
}

/* ── Preloader ───────────────────────────────────────────────── */
.page-loading {
  background: linear-gradient(135deg, #0a4e9b, #2cc3e8) !important;
}

/* ── Formulários Trabalhe Conosco e Fale Conosco ─────────────── */
#trabalhe .form-label,
#contato .form-label {
  color: #fff !important;
}
#trabalhe .form-control,
#trabalhe .form-select,
#contato .form-control,
#contato .form-select {
  color: #fff !important;
  background-color: rgba(255,255,255,.18) !important;
  border-color: rgba(255,255,255,.35) !important;
  caret-color: #fff;
}
#trabalhe .form-control::placeholder,
#trabalhe .form-select::placeholder,
#contato .form-control::placeholder,
#contato .form-select::placeholder {
  color: rgba(255,255,255,.55) !important;
}
/* Override autofill do browser */
#trabalhe .form-control:-webkit-autofill,
#trabalhe .form-control:-webkit-autofill:hover,
#trabalhe .form-control:-webkit-autofill:focus,
#contato .form-control:-webkit-autofill,
#contato .form-control:-webkit-autofill:hover,
#contato .form-control:-webkit-autofill:focus {
  -webkit-text-fill-color: #fff !important;
  -webkit-box-shadow: 0 0 0 1000px rgba(255,255,255,.18) inset !important;
  caret-color: #fff;
}
#trabalhe .form-label small,
#trabalhe .form-label span {
  color: rgba(255,255,255,.7) !important;
}

/* ── Footer nav-links (telefone/email) ───────────────────────── */
footer .nav-link:hover,
footer .nav-link:focus {
  color: rgba(255,255,255,.75) !important;
  opacity: 1 !important;
}

/* ── Scroll-to-top btn ───────────────────────────────────────── */
.btn-scroll-top {
  background-color: var(--ultra-navy) !important;
}
.btn-scroll-top:hover {
  background-color: var(--ultra-cyan) !important;
}

/* ── Swiper ─────────────────────────────────────────────────── */
.swiper-pagination-bullet-active {
  background-color: var(--ultra-cyan) !important;
}
.swiper-button-next,
.swiper-button-prev {
  color: var(--ultra-cyan) !important;
}

/* ── font-fredoka → Gotham Black (grandes números) ──────────── */
.font-fredoka {
  font-family: 'Gotham', 'Poppins', sans-serif !important;
  font-weight: 900 !important;
}

/* ── Stats do Histórico — borda só em md+ ───────────────────── */
@media (min-width: 768px) {
  .ultra-stat-divider {
    border-right: 1px solid #dee2e6;
  }
}

/* ── Stat números no hero ────────────────────────────────────── */
.ultra-stat-num {
  font-weight: 900;
  font-size: 2.5rem;
  line-height: 1;
  color: var(--ultra-cyan);
}
.ultra-stat-label {
  font-size: .8rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: rgba(255,255,255,.7);
}