/* ==========================================================================
   Extras do cabeçalho (todas as páginas): busca, idioma, botão de agendamento
   e aviso de cookies. Complementa assets/css/styles.css (menu) e home-hero.css.
   ========================================================================== */

/* ---------- Itens extras do menu ---------- */
.nav-icon-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; width: 40px; height: 40px; padding: 0; border: 1px solid currentColor; border-radius: 50%; background: transparent; color: var(--menu-color); font: inherit; cursor: pointer; transition: color .2s, background .2s, border-color .2s; }
.nav-icon-btn i { font-size: 16px; line-height: 1; }
.nav-icon-btn:hover { border-color: #36c0f4; background: #36c0f41f; color: #36c0f4; }
.nav-extra__label { display: none; }

.lang-switch { display: inline-flex; align-items: center; gap: 6px; }
.lang-switch button { display: inline-flex; padding: 2px; border: 1px solid transparent; border-radius: 5px; background: transparent; line-height: 0; cursor: pointer; opacity: .6; transition: opacity .2s, border-color .2s, transform .2s; }
.lang-switch button:hover { opacity: 1; transform: translateY(-1px); }
.lang-switch button.is-active { border-color: #36c0f4; opacity: 1; }
.lang-switch svg { width: 24px; height: 16px; border-radius: 2px; box-shadow: 0 0 0 1px #00000026; }

/* Pílula azul com degradê suave e sombra discreta. */
#header .navbar a.nav-cta,
#header .navbar a.nav-cta:focus { display: inline-flex; align-items: center; gap: 8px; padding: 11px 20px; border-radius: 999px; background: linear-gradient(135deg, #16a6e6 0%, #0b93d6 100%); color: #fff; font-size: 14.5px; font-weight: 700; box-shadow: 0 4px 12px #0877c02e; transition: background .2s, box-shadow .2s, transform .2s; }
/* Hover só clareia: escurecer fazia o botão sumir no fundo escuro do hero. */
#header .navbar a.nav-cta:hover { background: linear-gradient(135deg, #2cb4ee 0%, #1ba2e2 100%); color: #fff; box-shadow: 0 6px 16px #0877c03d; transform: translateY(-1px); }
#header .navbar a.nav-cta::before { display: none; }
#header .navbar a.nav-cta i { margin: 0; font-size: 15px; }

@media (min-width: 1280px) {
  .stikcy-menu .nav-icon-btn { color: var(--text-color); }
  /* Com os extras o menu fica mais cheio: itens um pouco mais próximos. */
  #header .navbar > ul > li { padding-left: 20px; }
  #header .navbar > ul > li.nav-extra { padding-left: 14px; }
  #header .navbar > ul > li.nav-extra--search { padding-left: 24px; }
  #header .navbar > ul > li:nth-child(9) { animation-delay: .96s; }
  #header .navbar > ul > li:nth-child(10) { animation-delay: 1.06s; }
  #header .navbar > ul > li:nth-child(11) { animation-delay: 1.16s; }
}
@media (min-width: 1280px) and (max-width: 1500px) {
  #header .navbar a, #header .navbar a:focus { font-size: 15px; }
  #header .navbar > ul > li { padding-left: 16px; }
  #header .navbar a.nav-cta, #header .navbar a.nav-cta:focus { padding: 10px 16px; font-size: 14px; }
}

/* Telas de 1280 a 1400px: o menu completo não cabe; logo, links, bandeiras e botão ficam mais compactos. */
@media (min-width: 1280px) and (max-width: 1400px) {
  #header .logo img { width: 168px; }
  #header .navbar a, #header .navbar a:focus { font-size: 14.5px; }
  #header .navbar > ul > li { padding-left: 13px; }
  #header .navbar > ul > li.nav-extra { padding-left: 10px; }
  #header .navbar > ul > li.nav-extra--search { padding-left: 16px; }
  .nav-icon-btn { width: 36px; height: 36px; }
  .lang-switch { gap: 2px; }
  .lang-switch svg { width: 21px; height: 14px; }
  #header .navbar a.nav-cta, #header .navbar a.nav-cta:focus { gap: 6px; padding: 9px 13px; font-size: 13.5px; }
}

@media (min-width: 1280px) and (max-width: 1330px) {
  #header .navbar > ul > li { padding-left: 10px; }
  #header .navbar > ul > li.nav-extra--search { padding-left: 14px; }
}

/* Página traduzida pelo Google (EN/ES): os textos do menu ficam mais longos. */
@media (min-width: 1280px) and (max-width: 1500px) {
  html.translated-ltr #header .navbar a, html.translated-ltr #header .navbar a:focus { font-size: 13.5px; }
  html.translated-ltr #header .navbar > ul > li { padding-left: 11px; }
  html.translated-ltr #header .navbar a.nav-cta, html.translated-ltr #header .navbar a.nav-cta:focus { padding: 9px 12px; font-size: 13px; }
}

/* No menu lateral do celular os extras viram linhas próprias. */
@media (max-width: 1279px) {
  .navbar > ul > li.nav-extra { padding: 6px 20px; }
  .nav-icon-btn { width: auto; height: auto; padding: 10px 0; border: 0; border-radius: 0; color: #fff; font-size: 15px; }
  .nav-icon-btn:hover { background: transparent; color: #fff; }
  .nav-extra__label { display: inline; }
  .lang-switch { gap: 10px; padding: 6px 0; }
  .lang-switch svg { width: 30px; height: 20px; }
  /* Sobre o fundo azul do menu, bandeira apagada distorce as cores: fica quase opaca. */
  .lang-switch button { opacity: .85; }
  .lang-switch button.is-active { border-color: #fff; }
  #header .navbar a.nav-cta, #header .navbar a.nav-cta:focus { justify-content: center; margin: 10px 0 20px; padding: 13px 18px; }
}

/* ---------- Âncoras dos sistemas: folga para o menu fixo não cobrir o título ---------- */
[id^="sistema-"], #sistemas { scroll-margin-top: 100px; }

/* ---------- Busca ---------- */
.site-search { position: fixed; inset: 0; z-index: 10050; display: flex; justify-content: center; align-items: flex-start; padding: 12vh 20px 20px; }
.site-search[hidden] { display: none; }
.site-search__backdrop { position: absolute; inset: 0; background: #08234099; -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.site-search__panel { position: relative; width: 100%; max-width: 640px; padding: 22px; border-radius: 18px; background: #fff; box-shadow: 0 30px 70px #00000040; animation: site-search-in .25s ease-out; }
.site-search__row { display: flex; align-items: center; gap: 10px; }
.site-search__row > i { color: #079bdc; font-size: 20px; }
.site-search__input { flex: 1; min-width: 0; padding: 12px 4px; border: 0; border-bottom: 2px solid #d7e8f2; background: transparent; color: #09284e; font: 500 19px/1.3 "Plus Jakarta Sans", "Segoe UI", sans-serif; outline: none; }
.site-search__input:focus { border-bottom-color: #079bdc; }
.site-search__submit { padding: 12px 18px; border: 0; border-radius: 12px; background: #09284e; color: #fff; font: 700 14px/1 "Plus Jakarta Sans", "Segoe UI", sans-serif; cursor: pointer; }
.site-search__submit:hover { background: #10366b; }
.site-search__close { position: absolute; top: -14px; right: -14px; display: grid; place-items: center; width: 36px; height: 36px; border: 0; border-radius: 50%; background: #fff; color: #09284e; font-size: 20px; box-shadow: 0 8px 20px #00000033; cursor: pointer; }
.site-search__hint { margin: 12px 0 0; color: #526a83; font-size: 13px; }
.site-search-open { overflow: hidden; }
@keyframes site-search-in { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }
@media (max-width: 575px) {
  .site-search__panel { padding: 18px; }
  .site-search__row { flex-wrap: wrap; }
  .site-search__submit { width: 100%; }
  .site-search__close { top: -12px; right: -6px; }
}

/* ---------- Aviso de cookies ---------- */
.cookie-notice { position: fixed; right: 18px; bottom: 18px; left: 18px; z-index: 9990; display: flex; align-items: center; gap: 18px; max-width: 820px; margin: 0 auto; padding: 16px 18px 16px 22px; border: 1px solid #d7e8f2; border-radius: 16px; background: #fff; box-shadow: 0 20px 50px #09284e33; color: #526a83; font: 400 14px/1.55 "Plus Jakarta Sans", "Segoe UI", sans-serif; opacity: 0; transform: translateY(16px); transition: opacity .3s, transform .3s; }
.cookie-notice[hidden] { display: none; }
.cookie-notice.is-visible { opacity: 1; transform: none; }
.cookie-notice p { margin: 0; }
.cookie-notice a { color: #079bdc; font-weight: 700; text-decoration: underline; }
.cookie-notice__accept { flex-shrink: 0; padding: 11px 22px; border: 0; border-radius: 10px; background: #09284e; color: #fff; font: 700 14px/1 "Plus Jakarta Sans", "Segoe UI", sans-serif; cursor: pointer; }
.cookie-notice__accept:hover { background: #10366b; }
@media (max-width: 575px) {
  .cookie-notice { flex-direction: column; align-items: stretch; gap: 12px; }
}

/* ---------- Google Tradutor: esconde barra e balões próprios ---------- */
#google_translate_element, .goog-te-banner-frame, iframe.skiptranslate, #goog-gt-tt, .goog-te-balloon-frame { display: none !important; }
body { top: 0 !important; }
.goog-text-highlight { background: none !important; box-shadow: none !important; }

@media (prefers-reduced-motion: reduce) {
  .site-search__panel { animation: none; }
  .cookie-notice { transition: none; }
}


/* ==========================================================================
   Rodapé (application/views/view_site_footer.php)
   ========================================================================== */
.sf { --sf-navy: #082340; --sf-navy-2: #0b2e52; --sf-line: #ffffff17; --sf-muted: #bfd1e2; --sf-cyan: #36c0f4;
  position: relative; overflow: hidden; padding-top: 80px; background: radial-gradient(ellipse at 85% 0%, #1a4f8a55 0, transparent 55%), var(--sf-navy); color: #dbe7f2; font: 400 15px/1.6 "Plus Jakarta Sans", "Segoe UI", system-ui, sans-serif; }
.sf *, .sf *::before, .sf *::after { box-sizing: border-box; }
.sf h3, .sf p, .sf ul { margin: 0; }
.sf ul { padding: 0 !important; list-style: none; }
.sf a { color: inherit; text-decoration: none; transition: color .2s; }
.sf a:hover { color: var(--sf-cyan); }
.sf-container { width: calc(100% - 64px); max-width: 1500px; margin: 0 auto; }

/* Chamada final */
.sf-cta { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 32px; padding: 36px 44px; border: 1px solid #36c0f440; border-radius: 26px; background: linear-gradient(120deg, #0f3a66 0%, #0b2e52 60%, #0d4a78 100%); box-shadow: 0 24px 50px #00000040; }
.sf-eyebrow { display: block; margin-bottom: 8px; color: var(--sf-cyan); font-size: 12.5px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.sf-cta strong { display: block; color: #fff; font-size: clamp(22px, 2.1vw, 30px); font-weight: 800; line-height: 1.2; letter-spacing: -.02em; }
.sf-cta p { margin-top: 8px; color: #b8cbe0; font-size: 15.5px; }
.sf-cta__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.sf-btn { display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 52px; padding: 0 24px; border-radius: 999px; font-size: 15px; font-weight: 700; white-space: nowrap; transition: transform .2s, background .2s, box-shadow .2s; }
.sf-btn i { font-size: 17px; }
.sf .sf-btn--primary { background: linear-gradient(135deg, #16a6e6 0%, #0b93d6 100%); color: #fff; box-shadow: 0 6px 16px #0877c040; }
.sf .sf-btn--primary:hover { background: linear-gradient(135deg, #2cb4ee 0%, #1ba2e2 100%); color: #fff; transform: translateY(-1px); }
.sf .sf-btn--wa { background: #25d366; color: #052e16; }
.sf .sf-btn--wa:hover { background: #3ee07b; color: #052e16; transform: translateY(-1px); }

/* Colunas */
/* Sem a faixa de números: a borda da barra final separa as colunas. */
.sf-main { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, .8fr) minmax(0, .8fr) minmax(0, 1.2fr); gap: 48px; padding: 72px 0 64px; }
.sf-logo img { display: block; width: 190px; height: auto; }
.sf .sf-brand p { max-width: 38ch; margin-top: 18px; color: var(--sf-muted); }
.sf-badge { display: inline-flex; align-items: center; gap: 8px; margin-top: 18px; padding: 7px 12px; border: 1px solid var(--sf-line); border-radius: 999px; background: #ffffff0a; color: #dbe7f2; font-size: 12.5px; font-weight: 700; }
.sf-badge i { color: var(--sf-cyan); }
.sf-social { display: flex; gap: 10px; margin-top: 22px; }
.sf .sf-social a { display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid var(--sf-line); border-radius: 50%; background: #ffffff0a; color: #fff; font-size: 15px; transition: background .2s, border-color .2s, color .2s, transform .2s; }
.sf .sf-social a:hover { border-color: var(--sf-cyan); background: var(--sf-cyan); color: var(--sf-navy); transform: translateY(-2px); }
.sf-col h3 { margin-bottom: 18px; color: #fff; font-size: 16px; font-weight: 800; letter-spacing: -.01em; text-transform: none; }
.sf-col li + li { margin-top: 11px; }
.sf .sf-col li a { color: #d3e0ec; font-size: 14.5px; }
.sf-col li a:hover { color: #fff; }
.sf .sf-wa { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; padding: 12px 16px; border: 1px solid #25d36640; border-radius: 14px; background: #25d3661a; color: #fff; }
.sf .sf-wa:hover { border-color: #25d366; color: #fff; }
.sf-wa i { color: #25d366; font-size: 26px; }
.sf-wa span { display: grid; font-size: 16px; font-weight: 800; line-height: 1.25; }
.sf-wa small { color: var(--sf-muted); font-size: 11.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.sf-contact li { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 10px; align-items: start; }
.sf-contact li i { margin-top: 5px; color: var(--sf-cyan); font-size: 13px; }
.sf-line { display: block; }

/* Números */
.sf-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--sf-line); }
.sf-stats li { display: grid; gap: 2px; padding: 26px 20px; text-align: center; }
.sf-stats li + li { border-left: 1px solid var(--sf-line); }
.sf-stats strong { color: #fff; font-size: 20px; font-weight: 800; letter-spacing: -.01em; }
.sf-stats strong i { color: #f5b301; font-size: 15px; }
.sf-stats span { color: var(--sf-muted); font-size: 13px; }

/* Barra final */
.sf-bottom { border-top: 1px solid var(--sf-line); background: #061a31; }
.sf-bottom__inner { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; padding: 20px 0; color: #c9d8e6; font-size: 14px; }
.sf .sf-bottom p { color: #c9d8e6; } /* o template força cor nos <p> */
.sf .sf-bottom a { color: #fff; font-weight: 600; }
.sf .sf-bottom a:hover { color: var(--sf-cyan); }

@media (max-width: 1100px) {
  .sf-main { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px; }
  .sf-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sf-stats li:nth-child(3) { border-left: 0; }
  .sf-stats li:nth-child(n+3) { border-top: 1px solid var(--sf-line); }
}
@media (max-width: 700px) {
  .sf { padding-top: 56px; }
  .sf-container { width: calc(100% - 40px); }
  .sf-cta { grid-template-columns: 1fr; padding: 28px 22px; border-radius: 20px; }
  .sf-cta__actions { display: grid; }
  .sf-main { grid-template-columns: 1fr 1fr; gap: 34px 20px; padding: 52px 0 40px; }
  .sf-brand, .sf-contact { grid-column: 1 / -1; }
  .sf-stats li { padding: 20px 10px; }
  .sf-stats strong { font-size: 17px; }
  .sf-bottom__inner { justify-content: center; text-align: center; }
}
@media (prefers-reduced-motion: reduce) {
  .sf-btn, .sf .sf-social a { transition: none; }
}


/* ==========================================================================
   Painel "Agendar demonstração" (application/views/view_demo_drawer.php)
   ========================================================================== */
.demo-drawer { position: fixed; inset: 0; z-index: 10060; font: 400 15px/1.5 "Plus Jakarta Sans", "Segoe UI", system-ui, sans-serif; }
.demo-drawer[hidden] { display: none; }
.demo-drawer *, .demo-drawer *::before, .demo-drawer *::after { box-sizing: border-box; }
.demo-drawer h2, .demo-drawer h3, .demo-drawer p, .demo-drawer fieldset { margin: 0; }
.demo-drawer__backdrop { position: absolute; inset: 0; background: #061a31a6; opacity: 0; -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); transition: opacity .3s; }
.demo-drawer__panel { position: absolute; top: 0; right: 0; bottom: 0; display: flex; flex-direction: column; width: min(560px, 100%); overflow-y: auto; background: #fff; box-shadow: -24px 0 60px #061a3140; transform: translateX(100%); transition: transform .38s cubic-bezier(.22, 1, .36, 1); outline: none; }
.demo-drawer.is-open .demo-drawer__backdrop { opacity: 1; }
.demo-drawer.is-open .demo-drawer__panel { transform: none; }
.demo-drawer-open { overflow: hidden; }

.demo-drawer__head { position: relative; display: flex; justify-content: space-between; gap: 16px; padding: 30px 32px 26px; background: radial-gradient(ellipse at 100% 0%, #36c0f433 0, transparent 60%), linear-gradient(140deg, #0b2e52, #082340); color: #fff; }
.demo-drawer__eyebrow { display: block; margin-bottom: 8px; color: #36c0f4; font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.demo-drawer__head h2 { color: #fff; font-family: "Plus Jakarta Sans", "Segoe UI", sans-serif; font-size: 26px; font-weight: 800; line-height: 1.15; letter-spacing: -.02em; text-transform: none; }
.demo-drawer__head p { margin-top: 8px; color: #c9d8e6; font-size: 14.5px; }
.demo-drawer__close { flex-shrink: 0; display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid #ffffff33; border-radius: 50%; background: #ffffff14; color: #fff; font-size: 16px; cursor: pointer; transition: background .2s; }
.demo-drawer__close:hover { background: #ffffff2e; }

.demo-form { display: grid; gap: 18px; padding: 26px 32px 32px; }
.demo-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.demo-field { display: grid; gap: 7px; min-width: 0; border: 0; padding: 0; }
.demo-field--full { grid-column: 1 / -1; }
.demo-field > span, .demo-field > legend { padding: 0; color: #09284e; font-size: 13.5px; font-weight: 700; }
.demo-field b { margin-left: 2px; color: #d93b5b; font-weight: 700; }
.demo-field small { color: #7d93a8; font-weight: 500; }
.demo-field input, .demo-field select, .demo-field textarea { width: 100%; padding: 12px 14px; border: 1.5px solid #d3e3ee; border-radius: 12px; background: #f7fbfe; color: #09284e; font: 500 15px/1.4 "Plus Jakarta Sans", "Segoe UI", sans-serif; transition: border-color .2s, box-shadow .2s, background .2s; }
.demo-field select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, #526a83 50%), linear-gradient(135deg, #526a83 50%, transparent 50%); background-position: calc(100% - 20px) 50%, calc(100% - 15px) 50%; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 38px; }
.demo-field textarea { resize: vertical; min-height: 84px; }
/* O plugin nice-select do template troca os <select>: no painel fica o campo nativo. */
.demo-form .nice-select { display: none !important; }
.demo-form select { display: block !important; height: auto; border: 1.5px solid #d3e3ee !important; border-radius: 12px !important; background-color: #f7fbfe !important; }
.demo-field input:focus, .demo-field select:focus, .demo-field textarea:focus { border-color: #0b93d6; background: #fff; box-shadow: 0 0 0 4px #36c0f42e; outline: none; }
.demo-field .is-invalid, .demo-field input.is-invalid, .demo-field select.is-invalid { border-color: #d93b5b; background: #fff6f8; }

.demo-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 2px; }
.demo-chips--two .demo-chip { flex: 1; }
.demo-chip { position: relative; cursor: pointer; }
.demo-chip input { position: absolute; opacity: 0; pointer-events: none; }
.demo-chip span { display: inline-flex; align-items: center; justify-content: center; gap: 7px; width: 100%; padding: 9px 14px; border: 1.5px solid #d3e3ee; border-radius: 999px; background: #fff; color: #334e68; font-size: 13.5px; font-weight: 700; transition: border-color .2s, background .2s, color .2s; }
.demo-chip:hover span { border-color: #9cdaf4; }
.demo-chip input:checked + span { border-color: #0b93d6; background: #e8f6fd; color: #0877c0; }
.demo-chip input:focus-visible + span { box-shadow: 0 0 0 4px #36c0f440; }

.demo-form__captcha:empty { display: none; }
.demo-form__error { padding: 11px 14px; border-radius: 10px; background: #fff0f3; color: #b4213f; font-size: 14px; font-weight: 600; }
.demo-form__submit { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 56px; padding: 0 24px; border: 0; border-radius: 14px; background: linear-gradient(135deg, #16a6e6 0%, #0b93d6 100%); color: #fff; font: 700 16px/1 "Plus Jakarta Sans", "Segoe UI", sans-serif; box-shadow: 0 10px 22px #0877c03d; cursor: pointer; transition: transform .2s, box-shadow .2s, opacity .2s; }
.demo-form__submit:hover { transform: translateY(-1px); box-shadow: 0 14px 28px #0877c052; }
.demo-form__submit.is-loading { opacity: .75; cursor: progress; }
.demo-form__submit.is-loading i { animation: demo-spin .8s linear infinite; }
.demo-form__submit.is-loading i::before { content: "\f130"; }
@keyframes demo-spin { to { transform: rotate(360deg); } }
.demo-form__legal { color: #7d93a8; font-size: 12.5px; text-align: center; }
.demo-form__legal a { color: #0877c0; font-weight: 700; text-decoration: underline; }

.demo-success { display: grid; justify-items: center; gap: 12px; padding: 56px 36px; text-align: center; }
.demo-success[hidden] { display: none; }
.demo-success__icon { display: grid; place-items: center; width: 76px; height: 76px; border-radius: 50%; background: #e3f8ec; color: #1aa35a; font-size: 36px; animation: demo-pop .45s cubic-bezier(.22, 1.4, .36, 1); }
@keyframes demo-pop { from { transform: scale(.4); opacity: 0; } to { transform: none; opacity: 1; } }
.demo-success h3 { color: #09284e; font-family: "Plus Jakarta Sans", "Segoe UI", sans-serif; font-size: 26px; font-weight: 800; }
.demo-success p { max-width: 38ch; color: #526a83; }
.demo-success__wa { display: inline-flex; align-items: center; gap: 9px; margin-top: 8px; padding: 13px 22px; border-radius: 999px; background: #25d366; color: #052e16 !important; font-weight: 700; text-decoration: none; }
.demo-success__wa i { font-size: 18px; }
.demo-success__close { border: 0; background: none; color: #526a83; font: 600 14px/1 "Plus Jakarta Sans", sans-serif; text-decoration: underline; cursor: pointer; }

@media (max-width: 575px) {
  .demo-drawer__head { padding: 24px 20px 20px; }
  .demo-drawer__head h2 { font-size: 22px; }
  .demo-form { padding: 22px 20px 26px; }
  .demo-form__grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .demo-drawer__panel, .demo-drawer__backdrop { transition: none; }
  .demo-success__icon { animation: none; }
}

/* ---------- Assistente de atendimento ---------- */
.rbot { --rbot-bottom: 24px; position: fixed; right: 24px; bottom: var(--rbot-bottom); z-index: 10020; font: 400 14px/1.5 "Plus Jakarta Sans", "Segoe UI", system-ui, sans-serif; color: #1c3550; }
.rbot *, .rbot *::before, .rbot *::after { box-sizing: border-box; }
.rbot__launcher { position: relative; display: grid; place-items: center; width: 62px; height: 62px; margin-left: auto; border: 0; border-radius: 50%; background: linear-gradient(145deg, #16a6e6 0%, #0877c0 100%); color: #fff; font-size: 26px; box-shadow: 0 14px 34px #0877c055, 0 0 0 0 #16a6e666; cursor: pointer; transition: transform .2s, box-shadow .2s; animation: rbot-pulse 2.8s ease-out 3s 3; }
.rbot__launcher:hover { transform: translateY(-2px) scale(1.04); box-shadow: 0 18px 40px #0877c066; }
.rbot__launcher:focus-visible { outline: 3px solid #36c0f4; outline-offset: 3px; }
.rbot__launcher i { position: absolute; transition: transform .25s, opacity .2s; }
.rbot__launcher-close { font-size: 22px; opacity: 0; transform: rotate(-90deg) scale(.6); }
.rbot.is-open .rbot__launcher-open { opacity: 0; transform: rotate(90deg) scale(.6); }
.rbot.is-open .rbot__launcher-close { opacity: 1; transform: none; }
@keyframes rbot-pulse { 0% { box-shadow: 0 14px 34px #0877c055, 0 0 0 0 #16a6e666; } 70% { box-shadow: 0 14px 34px #0877c055, 0 0 0 16px #16a6e600; } 100% { box-shadow: 0 14px 34px #0877c055, 0 0 0 0 #16a6e600; } }

.rbot__teaser { position: absolute; right: 0; bottom: 78px; display: flex; align-items: center; gap: 12px; width: max-content; max-width: calc(100vw - 48px); padding: 14px 40px 14px 14px; border: 1px solid #dbe9f3; border-radius: 18px 18px 6px 18px; background: #fff; box-shadow: 0 18px 44px #09284e2e; opacity: 0; transform: translateY(10px) scale(.96); transform-origin: bottom right; transition: opacity .25s, transform .25s; }
.rbot__teaser[hidden] { display: none; }
.rbot__teaser.is-visible { opacity: 1; transform: none; }
.rbot__teaser-avatar { display: grid; place-items: center; flex-shrink: 0; width: 38px; height: 38px; border-radius: 50%; background: #e3f4fc; color: #0b93d6; font-size: 18px; }
.rbot__teaser-text { padding: 0; border: 0; background: none; color: #09284e; font: 600 14.5px/1.4 inherit; font-family: inherit; text-align: left; cursor: pointer; }
.rbot__teaser-close { position: absolute; top: 6px; right: 6px; display: grid; place-items: center; width: 26px; height: 26px; padding: 0; border: 0; border-radius: 50%; background: none; color: #7890a8; font-size: 18px; cursor: pointer; }
.rbot__teaser-close:hover { background: #eef5fa; color: #09284e; }

.rbot__panel { position: absolute; right: 0; bottom: 78px; display: flex; flex-direction: column; width: 380px; height: min(600px, calc(100vh - 130px)); overflow: hidden; border: 1px solid #dbe9f3; border-radius: 22px; background: #f5f9fc; box-shadow: 0 30px 70px #09284e40; opacity: 0; transform: translateY(14px) scale(.97); transform-origin: bottom right; transition: opacity .22s, transform .22s; }
.rbot__panel[hidden] { display: none; }
.rbot__panel.is-visible { opacity: 1; transform: none; }
.rbot__head { display: flex; align-items: center; gap: 12px; padding: 16px 12px 16px 18px; background: radial-gradient(130% 160% at 100% 0%, #10366b 0%, #09284e 60%, #082340 100%); color: #fff; }
.rbot__avatar { position: relative; display: grid; place-items: center; flex-shrink: 0; width: 44px; height: 44px; border-radius: 50%; background: linear-gradient(145deg, #16a6e6, #0877c0); font-size: 20px; }
.rbot__avatar b { position: absolute; right: 1px; bottom: 1px; width: 11px; height: 11px; border: 2px solid #09284e; border-radius: 50%; background: #25d366; }
.rbot__title { flex: 1; min-width: 0; }
.rbot__title strong { display: block; color: #fff; font-size: 16px; font-weight: 700; line-height: 1.25; }
.rbot__title small { display: block; color: #a9c2da; font-size: 12.5px; }
.rbot__icon-btn { display: grid; place-items: center; flex-shrink: 0; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%; background: none; color: #cfe0ef; font-size: 17px; cursor: pointer; transition: background .2s, color .2s; }
.rbot__icon-btn:hover { background: #ffffff1a; color: #fff; }

.rbot__body { flex: 1; display: flex; flex-direction: column; gap: 8px; padding: 18px 16px 10px; overflow-y: auto; overscroll-behavior: contain; scroll-behavior: smooth; }
.rbot__msg { max-width: 86%; padding: 10px 14px; border-radius: 16px; font-size: 14px; line-height: 1.55; overflow-wrap: anywhere; animation: rbot-in .25s ease-out both; }
.rbot__msg b { font-weight: 700; color: inherit; }
.rbot__msg--bot { align-self: flex-start; border: 1px solid #e1edf5; border-bottom-left-radius: 6px; background: #fff; color: #1c3550; }
.rbot__msg--user { align-self: flex-end; margin: 6px 0 4px; border-bottom-right-radius: 6px; background: #09284e; color: #fff; }
.rbot__typing { display: flex; gap: 4px; padding: 14px 16px; }
.rbot__typing i { width: 7px; height: 7px; border-radius: 50%; background: #93aac2; animation: rbot-dot 1s infinite ease-in-out; }
.rbot__typing i:nth-child(2) { animation-delay: .15s; }
.rbot__typing i:nth-child(3) { animation-delay: .3s; }
@keyframes rbot-dot { 0%, 80%, 100% { opacity: .35; transform: none; } 40% { opacity: 1; transform: translateY(-3px); } }
@keyframes rbot-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

.rbot__link { align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; margin-top: 2px; padding: 9px 14px; border-radius: 12px; background: #e3f4fc; color: #0877c0 !important; font-size: 13.5px; font-weight: 600; text-decoration: none; animation: rbot-in .25s ease-out both; }
.rbot__link:hover { background: #d2edfa; }
.rbot__options { display: flex; flex-direction: column; align-items: flex-end; gap: 7px; margin: 4px 0 2px; animation: rbot-in .3s ease-out both; }
.rbot__opt { display: inline-flex; align-items: center; gap: 8px; max-width: 92%; padding: 9px 15px; border: 1px solid #b9dcef; border-radius: 999px; background: #fff; color: #0877c0 !important; font: 600 13.5px/1.35 inherit; font-family: inherit; text-align: right; text-decoration: none; cursor: pointer; transition: background .18s, border-color .18s, color .18s, transform .18s; }
.rbot__opt:hover { border-color: #0b93d6; background: #0b93d6; color: #fff !important; transform: translateX(-2px); }
.rbot__opt i { font-size: 15px; }
.rbot__opt--destaque { border-color: transparent; background: linear-gradient(135deg, #16a6e6, #0b93d6); color: #fff !important; }
.rbot__opt--destaque:hover { background: linear-gradient(135deg, #0b93d6, #0877c0); }
.rbot__opt--wa { border-color: #25d366; color: #0d7a3a !important; }
.rbot__opt--wa:hover { border-color: #25d366; background: #25d366; color: #052e16 !important; }
.rbot__opt--leve { border-color: #dbe6ee; color: #5d7690 !important; }
.rbot__opt--leve:hover { border-color: #09284e; background: #09284e; color: #fff !important; }
.rbot__options.is-used button.rbot__opt { opacity: .45; pointer-events: none; }

.rbot__compose { display: flex; align-items: center; gap: 8px; margin: 0; padding: 12px 14px 14px; border-top: 1px solid #e1edf5; background: #fff; }
.rbot__compose input { flex: 1; min-width: 0; height: 44px; padding: 0 16px; border: 1px solid #d3e3ee; border-radius: 999px; background: #f5f9fc; color: #09284e; font: 400 14px/1 inherit; font-family: inherit; outline: none; transition: border-color .2s, background .2s; }
.rbot__compose input:focus { border-color: #0b93d6; background: #fff; }
.rbot__compose button { display: grid; place-items: center; flex-shrink: 0; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: #09284e; color: #fff; font-size: 16px; cursor: pointer; transition: background .2s; }
.rbot__compose button:hover { background: #0b93d6; }

/* Botão "voltar ao topo" do template sobe para não disputar o canto com o assistente. */
.scroll-top { right: 30px !important; bottom: 100px !important; }
body.demo-drawer-open .rbot { visibility: hidden; }

@media (max-width: 1100px) {
  .rbot { --rbot-bottom: calc(24px + var(--cookie-h, 0px)); }
}
@media (max-width: 575px) {
  .rbot { right: 16px; --rbot-bottom: calc(16px + var(--cookie-h, 0px)); }
  .rbot__launcher { width: 56px; height: 56px; font-size: 24px; }
  .rbot__teaser, .rbot__panel { bottom: 70px; }
  .rbot__panel { position: fixed; right: 10px; bottom: calc(82px + var(--cookie-h, 0px)); left: 10px; width: auto; height: calc(100dvh - 110px - var(--cookie-h, 0px)); }
  .rbot__teaser { max-width: calc(100vw - 32px); }
  .scroll-top { right: 20px !important; bottom: 84px !important; }
}
@media (prefers-reduced-motion: reduce) {
  .rbot__launcher { animation: none; }
  .rbot__msg, .rbot__link, .rbot__options { animation: none; }
  .rbot__body { scroll-behavior: auto; }
}

/* ---------- Topo das páginas internas (view_page_hero) ---------- */
.page-hero { position: relative; z-index: 1; overflow: hidden; padding: 168px 0 84px; background: #0b2549; isolation: isolate; font-family: "Plus Jakarta Sans", "Segoe UI", system-ui, sans-serif; }
.page-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse at 82% 40%, #1a5f9a66 0, transparent 55%), radial-gradient(ellipse at 0% 100%, #082340 0, transparent 60%); pointer-events: none; }
.page-hero::after { content: ""; position: absolute; right: 0; bottom: 0; left: 0; height: 1px; background: linear-gradient(90deg, transparent, #36c0f455 30%, #36c0f455 70%, transparent); }
.page-hero #particles-js { position: absolute; inset: 0; z-index: -1; pointer-events: none; -webkit-mask-image: linear-gradient(100deg, #0004 0%, #0006 40%, #000 75%); mask-image: linear-gradient(100deg, #0004 0%, #0006 40%, #000 75%); }
.page-hero .page-hero__inner { position: relative; width: calc(100% - 64px); max-width: 1500px; margin: 0 auto; } /* mesma largura do menu e do hero da home */
.page-hero__crumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 22px; padding: 0 !important; list-style: none; }
.page-hero__crumbs li { display: inline-flex; align-items: center; color: #36c0f4; font-size: 14px; font-weight: 600; }
.page-hero__crumbs a { display: inline-flex; align-items: center; gap: 8px; color: #b8cbe0 !important; text-decoration: none; transition: color .2s; }
.page-hero__crumbs a:hover { color: #fff !important; }
.page-hero__crumbs a i { font-size: 12px; }
.page-hero__sep { color: #5f7c9b !important; font-size: 10px !important; }
.page-hero .page-hero__title { max-width: 820px; margin: 0; color: #fff; font-family: "Plus Jakarta Sans", sans-serif; font-size: clamp(36px, 4vw, 58px); font-weight: 700; line-height: 1.1; letter-spacing: -.04em; text-transform: none; }
.page-hero__title em { color: #36c0f4; font-style: normal; }
.page-hero .page-hero__text { max-width: 620px; margin: 18px 0 0; color: #b8cbe0; font-size: 18px; line-height: 1.6; }
.page-hero__crumbs, .page-hero__title, .page-hero__text { animation: page-hero-in .7s cubic-bezier(.22, 1, .36, 1) both; }
.page-hero__title { animation-delay: .08s; }
.page-hero__text { animation-delay: .16s; }
@keyframes page-hero-in { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@media (max-width: 991px) {
  .page-hero { padding: 132px 0 64px; }
  .page-hero .page-hero__text { font-size: 16px; }
}
@media (max-width: 575px) {
  .page-hero { padding: 116px 0 52px; }
  .page-hero .page-hero__title { font-size: clamp(30px, 8.5vw, 38px); }
  .page-hero__crumbs ol { margin-bottom: 16px; }
  .page-hero .page-hero__inner { width: calc(100% - 32px); padding-right: 0; padding-left: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .page-hero__crumbs, .page-hero__title, .page-hero__text { animation: none; }
}
