/* ============================================================
   Pet+ — Identidade visual
   Azul Confiança #1E3A8A · Laranja Energia #F97316 · Cinza Neutro #64748B
   Tipografia: Poppins (títulos/marca) + Inter (texto)
   ============================================================ */
:root{
  --pp:#1E3A8A;          /* azul principal */
  --pp-l:#2E4FB0;        /* azul claro (hover) */
  --pp-d:#152C66;        /* azul escuro */
  --pp-accent:#F97316;   /* laranja energia */
  --pp-accent-d:#EA6306; /* laranja hover */
  --pp-muted:#64748B;    /* cinza neutro */
  --pp-bg:#F8FAFC;       /* fundo suave */
  --pp-line:#E2E8F0;     /* divisórias */
}

body{
  background:var(--pp-bg);
  color:#1F2937;
  font-family:'Inter','Segoe UI',system-ui,sans-serif;
}
h1,h2,h3,h4,h5,h6,.navbar-brand,.display-1,.display-2,.display-3,.display-4{
  font-family:'Poppins','Segoe UI',sans-serif;
  font-weight:700;
}

/* ---- Navbar ---- */
.navbar-pp{background:var(--pp)}
.navbar-pp .nav-link,.navbar-pp .navbar-brand{color:#fff!important}
.navbar-pp .nav-link{font-weight:500;opacity:.92}
.navbar-pp .nav-link:hover{opacity:1}
.navbar-pp .nav-link.active{font-weight:600;opacity:1;border-bottom:2px solid var(--pp-accent)}

/* ---- Utilitários de cor ---- */
.text-pp{color:var(--pp)!important}
.text-accent{color:var(--pp-accent)!important}
.text-muted-pp{color:var(--pp-muted)!important}
.bg-pp{background:var(--pp)!important;color:#fff!important}
.bg-accent{background:var(--pp-accent)!important;color:#fff!important}

/* ---- Botões ---- */
.btn-pp{background:var(--pp);color:#fff;font-weight:600;border:none}
.btn-pp:hover,.btn-pp:focus{background:var(--pp-l);color:#fff}
.btn-outline-pp{border:1px solid var(--pp);color:var(--pp);font-weight:600}
.btn-outline-pp:hover{background:var(--pp);color:#fff}
.btn-accent{background:var(--pp-accent);color:#fff;font-weight:600;border:none}
.btn-accent:hover,.btn-accent:focus{background:var(--pp-accent-d);color:#fff}
.btn-warning{background:var(--pp-accent);border-color:var(--pp-accent);color:#fff}
.btn-warning:hover{background:var(--pp-accent-d);border-color:var(--pp-accent-d);color:#fff}

/* ---- Cards ---- */
.card-pp{border:1px solid var(--pp-line);border-radius:.75rem;box-shadow:0 1px 3px rgba(21,44,102,.06)}
.card-pp>.card-header{background:var(--pp);color:#fff;font-weight:600;border-radius:.75rem .75rem 0 0!important}

/* ---- Hero ---- */
.hero{background:linear-gradient(135deg,var(--pp-d),var(--pp));color:#fff;padding:4rem 0;position:relative;overflow:hidden}
.hero h1{color:#fff}
.hero .lead{color:#dbe4f7}
.hero .text-accent{color:#FDBA74!important}

/* ---- Badges ---- */
.badge.bg-pp{background:var(--pp)!important}
.badge.bg-accent{background:var(--pp-accent)!important}

/* ---- Progress / acentos ---- */
.progress-bar.bg-pp{background:var(--pp)}
.progress-bar.bg-accent{background:var(--pp-accent)}

/* ---- Links ---- */
a{color:var(--pp)}
a:hover{color:var(--pp-l)}

/* ---- Rodapé ---- */
footer.pp{background:var(--pp-d);color:#cbd5e1}
footer.pp a{color:#fff;text-decoration:none}
footer.pp a:hover{color:var(--pp-accent)}

/* ---- Produtos ---- */
.card-produto .card-img-top{height:180px;object-fit:cover}

/* ---- Tabelas ---- */
.table thead.table-pp th{background:var(--pp);color:#fff}

/* ---- Foco acessível ---- */
:focus-visible{outline:2px solid var(--pp-accent);outline-offset:2px}