/* ============================================================
   CAJAMAR NET — Tema "cajamarnet" para HESK 3
   Identidade do site principal aplicada sobre o tema hesk3.
   Carregado via head.txt, depois do app.min.css.
   ============================================================ */

/* ---------- Fontes self-hosted ---------- */
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/brand/ibm-plex-sans-400-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/brand/ibm-plex-sans-400-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 500; font-display: swap; src: url(../fonts/brand/ibm-plex-sans-500-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 500; font-display: swap; src: url(../fonts/brand/ibm-plex-sans-500-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 600; font-display: swap; src: url(../fonts/brand/ibm-plex-sans-600-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 600; font-display: swap; src: url(../fonts/brand/ibm-plex-sans-600-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 700; font-display: swap; src: url(../fonts/brand/ibm-plex-sans-700-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 700; font-display: swap; src: url(../fonts/brand/ibm-plex-sans-700-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Sora'; font-style: normal; font-weight: 700; font-display: swap; src: url(../fonts/brand/sora-700-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Sora'; font-style: normal; font-weight: 700; font-display: swap; src: url(../fonts/brand/sora-700-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Sora'; font-style: normal; font-weight: 800; font-display: swap; src: url(../fonts/brand/sora-800-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Sora'; font-style: normal; font-weight: 800; font-display: swap; src: url(../fonts/brand/sora-800-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 500; font-display: swap; src: url(../fonts/brand/ibm-plex-mono-500-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 500; font-display: swap; src: url(../fonts/brand/ibm-plex-mono-500-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }

:root {
  --cn-ink: #0b1220;
  --cn-night: #0e1628;
  --cn-night-line: #23304e;
  --cn-mist: #f3f5f9;
  --cn-line: #e2e7f0;
  --cn-ember: #f15427;
  --cn-ember-deep: #d8431c;
  --cn-ember-soft: #feede4;
  --cn-signal: #19c37d;
}

/* ---------- Tipografia ---------- */
body, html, input, textarea, select, button {
  font-family: 'IBM Plex Sans', 'Segoe UI', sans-serif !important;
}
h1, h2, h3, h4, h5, h6,
.header__logo,
.section-header,
.article__title {
  font-family: 'Sora', 'Segoe UI', sans-serif !important;
  letter-spacing: -.015em;
}

/* ---------- Barra da marca (header.txt) ---------- */
.cn-brandbar {
  background: rgba(255, 255, 255, .92);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--cn-line);
}
.cn-brandbar .cn-inner {
  max-width: 1180px;
  margin: 0 auto;
  padding: 16px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.cn-brandbar img { height: 44px; width: auto; display: block; }
.cn-brandbar .cn-back {
  font-family: 'Sora', sans-serif;
  font-weight: 600;
  font-size: .9rem;
  color: var(--cn-ink);
  text-decoration: none;
  border: 1px solid var(--cn-line);
  border-radius: 999px;
  padding: 9px 20px;
  transition: border-color .18s ease, color .18s ease, transform .18s ease;
  white-space: nowrap;
}
.cn-brandbar .cn-back:hover { border-color: var(--cn-ember); color: var(--cn-ember-deep); transform: translateY(-1px); }

/* ---------- Header do HESK vira faixa escura (page-hero) ---------- */
.header {
  background: var(--cn-night) !important;
  border-bottom: 0 !important;
  box-shadow: 0 22px 44px -18px rgba(11, 18, 32, .45);
}
.header__logo {
  color: #fff !important;
  font-weight: 800 !important;
}
.header a, .header .profile__user { color: #e7ecf5; }

/* breadcrumbs claros logo abaixo */
.breadcrumbs {
  background: #fff !important;
  border-bottom: 1px solid var(--cn-line) !important;
}
.breadcrumbs a, .breadcrumbs .last {
  font-family: 'IBM Plex Mono', monospace;
  font-size: .78rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}

/* ---------- Fundo geral ---------- */
.cust-help .wrapper, .wrapper { background: var(--cn-mist); }

/* ---------- Botões ---------- */
.btn, .btn-full, .btn--blue, .btn--blue-border, .btn-action {
  border-radius: 999px !important;
  font-family: 'Sora', sans-serif !important;
  font-weight: 600 !important;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease !important;
}
.btn-full, .btn--blue {
  box-shadow: 0 12px 30px -12px rgba(241, 84, 39, .55);
}
.btn-full:hover, .btn--blue:hover {
  transform: translateY(-2px);
  background-color: var(--cn-ember-deep) !important;
  border-color: var(--cn-ember-deep) !important;
}
.btn--blue-border:hover { transform: translateY(-2px); }

/* ---------- Cartões e blocos ---------- */
.card, .kb__category, .article, .ticket, .form, .table__wrapper,
.right-bar__inner, .navbar {
  border-radius: 14px;
}
.kb__category { transition: transform .22s ease, box-shadow .22s ease; }
.kb__category:hover { transform: translateY(-4px); box-shadow: 0 18px 50px -22px rgba(11, 18, 32, .25); }

/* ---------- Campos de formulário ---------- */
input[type="text"], input[type="email"], input[type="password"],
input[type="number"], textarea, select {
  border-radius: 10px !important;
}
input:focus, textarea:focus, select:focus {
  border-color: var(--cn-ember) !important;
  box-shadow: 0 0 0 4px rgba(241, 84, 39, .12) !important;
  outline: none;
}

/* foco visível para teclado */
a:focus-visible, button:focus-visible {
  outline: 3px solid var(--cn-ember);
  outline-offset: 2px;
  border-radius: 4px;
}

/* ---------- Rodapé com statusline da marca ---------- */
.cn-footbar {
  background: var(--cn-ink);
  border-top: 2px solid var(--cn-ember);
  padding: 16px 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 30px;
  flex-wrap: wrap;
  font-family: 'IBM Plex Mono', monospace;
  font-size: .72rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #8b96ad;
}
.cn-footbar strong { color: #e7ecf5; font-weight: 500; }
.cn-footbar a { color: #e7ecf5; text-decoration: none; }
.cn-footbar a:hover { color: var(--cn-ember); }
.cn-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--cn-signal);
  display: inline-block;
  margin-right: 8px;
  vertical-align: middle;
  box-shadow: 0 0 0 0 rgba(25, 195, 125, .55);
  animation: cnPulse 2.2s infinite;
}
@keyframes cnPulse {
  0%   { box-shadow: 0 0 0 0 rgba(25, 195, 125, .55); }
  70%  { box-shadow: 0 0 0 9px rgba(25, 195, 125, 0); }
  100% { box-shadow: 0 0 0 0 rgba(25, 195, 125, 0); }
}
@media (prefers-reduced-motion: reduce) {
  .cn-dot { animation: none; }
  * { transition-duration: .001s !important; }
}
@media (max-width: 620px) {
  .cn-brandbar img { height: 36px; }
  .cn-brandbar .cn-back { padding: 8px 14px; font-size: .8rem; }
}