/* ============================================================
   PATINHAGRAM — tema.css (nova identidade visual)
   Carregado DEPOIS do style.css: redefine as variáveis e refina
   os componentes. Cores extraídas do logo oficial:
   teal #0F5260 · pêssego #FFA265
   ============================================================ */

:root{
  /* nomes antigos mantidos → portal inteiro herda o tema novo */
  --azul:#0F5260;
  --azul-escuro:#0A3E49;
  --azul-claro:#EDF5F6;
  --laranja:#FFA265;
  --laranja-escuro:#F28C4A;
  --tinta:#16323A;
  --tinta-suave:#5E7A82;
  --linha:#E2ECEE;
  --verde:#2E9A6E;
  --verde-claro:#E4F5ED;
  --alerta:#D9534F;
  --alerta-claro:#FDECEA;
  --raio:18px;
  --raio-p:12px;
  --sombra:0 6px 24px rgba(15,82,96,.08);
  --sombra-alta:0 14px 40px rgba(15,82,96,.14);
}

body{
  background:#FDFBF7;
  color:var(--tinta);
}
h1,h2,h3,h4{font-family:'Baloo 2',cursive}

/* ---------- topo ---------- */
.topo{
  background:rgba(253,251,247,.92);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--linha);
  box-shadow:none;
}
.logo, .marca-txt{color:var(--azul)}
.menu a{border-radius:999px;font-weight:800}
.menu a:hover{background:var(--azul-claro);color:var(--azul)}
.menu a.ativo{background:var(--azul);color:#fff}
.menu a.destaque{
  background:var(--laranja);color:#fff;
  box-shadow:0 4px 14px rgba(255,162,101,.4);
}
.menu a.destaque:hover{background:var(--laranja-escuro)}
/* CRM agora é DISCRETO: link fino no canto, sem fundo chamativo */
.menu a.crm-topo{
  background:transparent;
  color:var(--tinta-suave);
  border:1.5px solid var(--linha);
  font-size:.82rem;
  padding:7px 13px;
}
.menu a.crm-topo:hover{color:var(--azul);border-color:var(--azul);background:transparent}

/* ---------- botões ---------- */
.btn{border-radius:999px;font-weight:800;transition:.18s}
.btn-laranja{
  background:var(--laranja);color:#fff;
  box-shadow:0 8px 22px rgba(255,162,101,.38);
}
.btn-laranja:hover{background:var(--laranja-escuro);transform:translateY(-2px)}
.btn-azul{
  background:var(--azul);color:#fff;
  box-shadow:0 8px 22px rgba(15,82,96,.28);
}
.btn-azul:hover{background:var(--azul-escuro);transform:translateY(-2px)}
.btn-fantasma{background:#fff;color:var(--azul);border:2px solid var(--linha)}
.btn-fantasma:hover{border-color:var(--azul)}

/* ---------- cartões e superfícies ---------- */
.card{
  border-radius:var(--raio);
  border:1px solid var(--linha);
  box-shadow:var(--sombra);
}
.card-hover:hover{transform:translateY(-5px);box-shadow:var(--sombra-alta)}

/* assinatura da marca: as duas metades do coração */
.card-marca, .modulo{position:relative;overflow:hidden}
.card-marca::before, .modulo::before{
  content:'';position:absolute;top:0;left:0;right:0;height:5px;
  background:linear-gradient(90deg,var(--azul) 0 50%,var(--laranja) 50% 100%);
}

/* ---------- formulários ---------- */
.campo input,.campo select,.campo textarea{
  border:2px solid var(--linha);
  border-radius:var(--raio-p);
  background:#fff;
  transition:.15s;
}
.campo input:focus,.campo select:focus,.campo textarea:focus{
  outline:none;border-color:var(--laranja);
}
.campo label{color:var(--azul);font-weight:800}

/* ---------- chips / filtros ---------- */
.chip{border:2px solid var(--linha);font-weight:800;color:var(--tinta-suave);border-radius:999px}
.chip.on{background:var(--azul);color:#fff;border-color:var(--azul)}

/* ---------- selos e badges ---------- */
.badge{border-radius:999px;font-weight:800}
.badge-azul{background:var(--azul-claro);color:var(--azul)}
.selo-pro{background:linear-gradient(135deg,var(--azul),var(--laranja))}

/* ---------- modais e avisos ---------- */
.modal{border-radius:22px;box-shadow:var(--sombra-alta)}
.aviso.ok{background:var(--verde-claro);color:var(--verde)}
.aviso.erro{background:var(--alerta-claro);color:var(--alerta)}

/* ---------- abas de auth ---------- */
.abas-auth{background:var(--azul-claro);border-radius:999px}
.abas-auth button.sel{background:#fff;color:var(--azul)}

/* ---------- rodapé ---------- */
.rodape{background:transparent;border-top:1px solid var(--linha);color:var(--tinta-suave)}

/* ---------- vinculo / conforto / estrelinha (harmonizados) ---------- */
.vinculo-card{background:linear-gradient(135deg,#EDF5F6,#FFF4EA);border-color:#CFE3E7}
.v-sim{background:var(--verde)}
.btn-perda{background:#FFF1EC;color:#D9534F;border-color:#F5C9C0}
.btn-book{background:linear-gradient(135deg,var(--laranja),#FF7E8A)}

/* logo em imagem no topo (usado pelo index novo; inofensivo nas demais) */
.marca-logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.marca-logo img.ico{height:42px}
.marca-logo img.nome{height:24px;margin-top:3px}