/* =====================================================================
   Shiel ID — menu, seletor de idioma, menu do celular e rodapé, iguais em todas as páginas
   (site e LPs de produto). Contexto visual SaaS editorial quente: fundo de papel, pílulas
   brancas com sombra quente, Space Grotesk 400/500, um só acento laranja.
   Tokens próprios (--ch-*) para não depender da folha de cada página.
   ===================================================================== */
:root {
  --ch-bg: #FAF5F0; --ch-pill: #F1E8DF; --ch-beige: #EFE6DD; --ch-line: #E6DCD2;
  --ch-ink: #111317; --ch-muted: #7A726C; --ch-orange: #FF5114; --ch-orange-deep: #E8430A;
  --ch-glass: rgba(255, 255, 255, 0.86);
  --ch-shadow: 0 10px 30px rgba(74, 54, 40, 0.10);
  --ch-shadow-big: 0 26px 70px rgba(74, 54, 40, 0.16);
  --ch-ease: cubic-bezier(0.6, 0, 0.12, 1);
  --ch-font: "Space Grotesk", system-ui, sans-serif;
}
.nav, .navmenu, .footer { font-family: var(--ch-font); letter-spacing: -0.005em; }
.nav button, .navmenu button { font-family: var(--ch-font); }

/* ---- Navbar : logo · menu · idioma · cta ---- */
.nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 80;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 22px 20px 0;
}
.nav__logo {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 46px;
  padding: 0 18px;
  border-radius: 999px;
  background: var(--ch-glass);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  backdrop-filter: blur(16px) saturate(140%);
  border: 1px solid var(--ch-line);
  flex-shrink: 0;
  box-shadow: var(--ch-shadow);
}
.nav__logo img { height: 22px; width: auto; }

/* ---- Menu de navegação (padrão NavigationMenu do shadcn, viewport=false) ---- */
.nm {
  display: flex;
  align-items: center;
  height: 46px;
  padding: 0 5px;
  border-radius: 999px;
  background: var(--ch-glass);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  backdrop-filter: blur(16px) saturate(140%);
  border: 1px solid var(--ch-line);
  box-shadow: var(--ch-shadow);
}
.nm__list { display: flex; align-items: center; gap: 2px; margin: 0; padding: 0; list-style: none; }
.nm__item { position: relative; }
.nm__trigger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  height: 36px;
  padding: 0 16px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  font: inherit;
  font-size: 14px;
  font-weight: 500;
  white-space: nowrap;
  color: rgba(17,19,23,0.72);
  cursor: pointer;
  transition: color .2s var(--ch-ease), background .2s var(--ch-ease), box-shadow .2s var(--ch-ease);
}
.nm__trigger:hover,
.nm__trigger[data-state="open"] { color: var(--ch-ink); background: rgba(255,255,255,0.6); }
.nm__trigger[data-active="true"] { color: var(--ch-ink); background: rgba(17,19,23,0.07); }
.nm__trigger[data-active="true"]:hover,
.nm__trigger[data-active="true"][data-state="open"] { background: rgba(255,255,255,0.6); }
.nm__trigger:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(255,81,20,0.32); }
.nm__chev {
  position: relative; top: 1px;
  width: 14px; height: 14px;
  stroke-width: 2.4;
  opacity: .6;
  transition: transform .3s var(--ch-ease), opacity .2s var(--ch-ease);
}
.nm__trigger[data-state="open"] .nm__chev { transform: rotate(180deg); opacity: 1; }

/* painel: abre logo abaixo do item, com fade + zoom-in-95 */
.nm__content {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 40;
  margin-top: 12px;
  padding: 8px;
  border-radius: 16px;
  background: #fff;
  color: var(--ch-ink);
  box-shadow: var(--ch-shadow-big); border: 1px solid var(--ch-line);
  transform-origin: top left;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: scale(.95);
  transition: opacity .2s var(--ch-ease), transform .2s var(--ch-ease), visibility 0s linear .2s;
}
.nm__content[data-state="open"] {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: none;
  transition: opacity .2s var(--ch-ease), transform .2s var(--ch-ease), visibility 0s;
}
/* ponte de hover entre o item e o painel */
.nm__content::before { content: ""; position: absolute; left: 0; right: 0; top: -14px; height: 14px; }

.nm__grid { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.nm__grid--products { width: 540px; grid-template-columns: .8fr 1fr; }
.nm__grid--products > .nm__feature-cell { grid-row: span 4; }
.nm__grid--sectors { width: 620px; grid-template-columns: 1fr 1fr; }

.nm__link {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 10px 12px;
  border-radius: 10px;
  color: var(--ch-ink);
  outline: none;
  transition: background .18s var(--ch-ease), box-shadow .18s var(--ch-ease);
}
a.nm__link:hover, a.nm__link:focus-visible { background: var(--ch-pill); }
a.nm__link:focus-visible { box-shadow: inset 0 0 0 2px rgba(255,81,20,0.35); }
.nm__link[aria-current="page"] { background: rgba(255,81,20,0.07); }
.nm__link[aria-current="page"] .nm__title { color: var(--ch-orange); }
.nm__title { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 500; line-height: 1.2; }
.nm__title .lucide { width: 16px; height: 16px; stroke-width: 2.1; color: var(--ch-orange); flex-shrink: 0; }
.nm__title .soon { margin-left: auto; }
.nm__desc {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.4;
  color: var(--ch-muted);
}
.nm__link.is-soon .nm__desc { color: #B3A9A1; }

.nm__feature {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 6px;
  height: 100%;
  padding: 20px;
  border-radius: 12px;
  color: var(--ch-ink);
  background:
    var(--ch-pill);
  outline: none;
  transition: box-shadow .2s var(--ch-ease);
}
.nm__feature img { width: 30px; height: auto; margin-bottom: auto; }
.nm__feature-title { margin-top: 18px; font-size: 17px; font-weight: 500; letter-spacing: -0.01em; transition: color .2s var(--ch-ease); }
.nm__feature-desc { font-size: 13px; line-height: 1.4; color: var(--ch-muted); }
.nm__feature:hover .nm__feature-title { color: var(--ch-orange); }
.nm__feature:focus-visible { box-shadow: inset 0 0 0 2px rgba(255,81,20,0.35); }

/* ---- Dropdown base (seletor de idioma) ---- */
.sectordrop {
  position: absolute;
  top: calc(100% + 14px);
  left: 50%;
  transform: translateX(-50%) translateY(8px);
  min-width: 232px;
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  border-radius: 18px;
  background: #fff;
  border: 1px solid var(--ch-line);
  box-shadow: var(--ch-shadow-big);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .24s var(--ch-ease), transform .24s var(--ch-ease), visibility .24s;
  z-index: 40;
}
/* hover bridge so the menu doesn't close in the gap */
.sectordrop::before {
  content: "";
  position: absolute;
  top: -14px; left: 0; right: 0; height: 14px;
}
.sectordrop__item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 14px;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 500;
  color: rgba(17,19,23,0.82);
  transition: background .18s var(--ch-ease), color .18s var(--ch-ease);
}
.sectordrop__item .lucide {
  width: 18px; height: 18px;
  stroke-width: 2.1;
  color: var(--ch-orange);
  flex-shrink: 0;
}
.sectordrop__item:hover {
  background: rgba(255,255,255,0.6);
  color: var(--ch-ink);
}

.nav__cta {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 34px;
  padding: 0 16px;
  margin-left: 4px;
  font-size: 13.5px;
  font-weight: 500;
  white-space: nowrap;
  color: #fff;
  border-radius: 999px;
  background: var(--ch-orange);
  box-shadow: 0 8px 22px rgba(255,81,20,0.30);
  transition: box-shadow .2s var(--ch-ease), transform .2s var(--ch-ease);
}
.nav__cta:hover { background: var(--ch-orange-deep); box-shadow: 0 10px 26px rgba(255,81,20,0.38); transform: translateY(-1px); }
.nav__cta .lucide { stroke-width: 2; }

/* ---- Mobile hamburger (liquid glass) + drawer ---- */
.nav__burger { display: none; }

@media (max-width: 1199px) {
  .nav {
    padding: 16px 16px 0;
  }
  /* no celular/tablet o menu de navegação dá lugar ao hambúrguer */
  .nm { display: none; }

  .nav__burger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px; height: 46px;
    border: 0;
    cursor: pointer;
    border-radius: 14px;
    background: var(--ch-glass);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  backdrop-filter: blur(16px) saturate(140%);
  border: 1px solid var(--ch-line);
  box-shadow: var(--ch-shadow);
    margin-left: 4px;
  }
  .nav__cta { margin-left: 0; }
}

.nav__burger-lines { position: relative; width: 19px; height: 13px; }
.nav__burger-lines i {
  position: absolute; left: 0; right: 0; height: 2px; border-radius: 2px;
  background: var(--ch-ink);
  transition: transform .32s var(--ch-ease), opacity .2s var(--ch-ease), top .32s var(--ch-ease);
}
.nav__burger-lines i:nth-child(1) { top: 0; }
.nav__burger-lines i:nth-child(2) { top: 5.5px; }
.nav__burger-lines i:nth-child(3) { top: 11px; }
.nav__burger.is-open .nav__burger-lines i:nth-child(1) { top: 5.5px; transform: rotate(45deg); }
.nav__burger.is-open .nav__burger-lines i:nth-child(2) { opacity: 0; }
.nav__burger.is-open .nav__burger-lines i:nth-child(3) { top: 5.5px; transform: rotate(-45deg); }

/* Drawer — menu mobile (folha branca, grupos recolhiveis, CTA fixo) */
.navmenu { position: fixed; inset: 0; z-index: 90; }
.navmenu[hidden] { display: none; }
.navmenu__scrim {
  position: absolute; inset: 0;
  background: rgba(74,54,40,0.28);
  -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px);
  opacity: 0; transition: opacity .34s var(--ch-ease);
}
.navmenu__panel {
  position: absolute; top: 0; right: 0; bottom: 0;
  width: 100%; max-width: 440px;
  display: flex; flex-direction: column;
  background: #fff; color: var(--ch-ink);
  box-shadow: -24px 0 60px rgba(74,54,40,0.16);
  transform: translateX(24px); opacity: 0;
  transition: transform .38s var(--ch-ease), opacity .3s var(--ch-ease);
}
.navmenu.is-open .navmenu__scrim { opacity: 1; }
.navmenu.is-open .navmenu__panel { transform: none; opacity: 1; }

.navmenu__head { flex-shrink: 0; display: flex; align-items: center; justify-content: space-between; padding: 16px 16px 10px; }
.navmenu__brand { display: flex; align-items: center; height: 46px; padding: 0 18px; border-radius: 999px; background: var(--ch-pill); }
.navmenu__brand img { height: 22px; width: auto; }
.navmenu__close {
  display: inline-flex; align-items: center; justify-content: center;
  width: 46px; height: 46px; border: 0; cursor: pointer;
  border-radius: 14px; color: var(--ch-ink); background: var(--ch-pill);
}
.navmenu__close .lucide { width: 20px; height: 20px; stroke-width: 2.2; }

.navmenu__body { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 2px 16px 20px; }
.navmenu__row {
  display: flex; align-items: center; gap: 14px;
  min-height: 60px; padding: 0 4px;
  border-bottom: 1px solid rgba(17,19,23,0.08);
  font-size: 18px; font-weight: 500; letter-spacing: -0.015em;
  color: var(--ch-ink); cursor: pointer; list-style: none;
  -webkit-tap-highlight-color: transparent;
}
.navmenu__row::-webkit-details-marker { display: none; }
.navmenu__row > span { flex: 1; min-width: 0; }
.navmenu__row > .lucide { width: 20px; height: 20px; color: #8E857F; stroke-width: 2; flex-shrink: 0; }
.navmenu__row > .navmenu__chev, .navmenu__row > .navmenu__ext { width: 18px; height: 18px; transition: transform .25s var(--ch-ease); }
.navmenu__group[open] > summary { border-bottom-color: transparent; }
.navmenu__group[open] > summary .navmenu__chev { transform: rotate(180deg); }
.navmenu__row.is-current, .navmenu__row.is-current > .lucide:first-child { color: var(--ch-orange); }

.navmenu__sub { display: flex; flex-direction: column; gap: 6px; padding: 0 0 16px; border-bottom: 1px solid rgba(17,19,23,0.08); }
.navmenu__sub--grid { display: grid; grid-template-columns: 1fr 1fr; }
.navmenu__item {
  display: flex; align-items: center; gap: 12px;
  min-height: 50px; padding: 8px 14px;
  border-radius: 14px; background: var(--ch-pill);
  font-size: 15.5px; font-weight: 500; line-height: 1.2; color: var(--ch-ink);
  -webkit-tap-highlight-color: transparent;
}
.navmenu__sub--grid .navmenu__item { font-size: 14.5px; gap: 10px; padding: 8px 12px; }
.navmenu__item .lucide { width: 18px; height: 18px; color: var(--ch-orange); stroke-width: 2; flex-shrink: 0; }
.navmenu__item:active { background: var(--ch-beige); }
.navmenu__item.is-current { color: var(--ch-orange); background: rgba(255,81,20,0.08); }
.navmenu .is-soon { color: #8E857F !important; background: transparent; }
.navmenu .is-soon .lucide { color: #C4BAB2 !important; }
.navmenu .soon { margin-left: auto; color: var(--ch-muted); background: var(--ch-beige); }

.navmenu__foot {
  flex-shrink: 0; display: flex; flex-direction: column; gap: 12px;
  padding: 14px 16px calc(16px + env(safe-area-inset-bottom));
  border-top: 1px solid rgba(17,19,23,0.08); background: #fff;
}
.navmenu__lang { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.navmenu__lang-label { font-size: 13px; font-weight: 500; color: var(--ch-muted); }
.navmenu__seg { display: flex; gap: 2px; padding: 3px; border-radius: 14px; background: var(--ch-pill); }
.navmenu__seg button {
  min-width: 52px; height: 44px; border: 0; border-radius: 11px; cursor: pointer;
  background: transparent; color: var(--ch-muted);
  font-family: inherit; font-size: 13px; font-weight: 500; letter-spacing: .04em;
  transition: background .2s var(--ch-ease), color .2s var(--ch-ease), box-shadow .2s var(--ch-ease);
}
.navmenu__seg button[aria-pressed="true"] { background: #fff; color: var(--ch-ink); box-shadow: 0 1px 3px rgba(17,19,23,0.12); }
.navmenu__cta {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  height: 54px; border-radius: 999px;
  font-size: 15.5px; font-weight: 500; color: #fff;
  background: var(--ch-orange);
  box-shadow: 0 10px 26px rgba(255,81,20,0.28);
}
.navmenu__cta .lucide { width: 17px; height: 17px; stroke-width: 2.2; }

@keyframes navmenuIn { from { opacity: 0; transform: translateY(8px); } }
.navmenu.is-open .navmenu__body > * { animation: navmenuIn .42s var(--ch-ease) both; }
.navmenu.is-open .navmenu__body > :nth-child(2) { animation-delay: .03s; }
.navmenu.is-open .navmenu__body > :nth-child(3) { animation-delay: .06s; }
.navmenu.is-open .navmenu__body > :nth-child(4) { animation-delay: .09s; }
.navmenu.is-open .navmenu__body > :nth-child(5) { animation-delay: .12s; }
.navmenu.is-open .navmenu__body > :nth-child(6) { animation-delay: .15s; }
@media (prefers-reduced-motion: reduce) { .navmenu.is-open .navmenu__body > * { animation: none; } }

@media (max-width: 380px) {
  .nav__cta { height: 38px; width: 38px; padding: 0; }
  .nav__cta span,
  .nav__cta { font-size: 0; }
  .nav__cta .lucide { width: 18px; height: 18px; }
}


/* itens "em breve" no menu */
.is-soon{color:#A39A93!important;cursor:default;pointer-events:none}
.is-soon .lucide{color:#C4BAB2!important}
.soon{font-style:normal;font-size:10px;font-weight:500;letter-spacing:.04em;text-transform:uppercase;color:#8E857F;background:rgba(17,19,23,.06);border-radius:999px;padding:2px 7px;margin-left:6px;white-space:nowrap;line-height:1.4}
.sectordrop__item.is-soon:hover{background:transparent}

/* ---- Nav: faixa intermediaria (menu compacto) + dropdown sem quebra ---- */
@media (min-width: 1200px) and (max-width: 1319px) {
  .nm__trigger { padding: 0 12px; font-size: 13.5px; }
}
.sectordrop { width: max-content; }
.sectordrop__item { white-space: nowrap; }
.sectordrop__item .soon { margin-left: auto; }

/* ---- Seletor de idioma (PT / EN / ES) ---- */
.nav--lang .nm { margin-left: auto; }
.lang {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 46px;
  padding: 0 14px;
  margin-right: auto;
  flex-shrink: 0;
  border-radius: 999px;
  cursor: pointer;
  font-size: 13.5px;
  font-weight: 500;
  letter-spacing: .02em;
  color: rgba(17,19,23,0.78);
  background: var(--ch-glass);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  backdrop-filter: blur(16px) saturate(140%);
  border: 1px solid var(--ch-line);
  box-shadow: var(--ch-shadow);
  transition: color .2s var(--ch-ease);
}
.lang:hover, .lang[aria-expanded="true"] { color: var(--ch-ink); }
.lang:focus-visible { outline: 2px solid var(--ch-orange); outline-offset: 2px; }
.lang > .lucide { width: 16px; height: 16px; stroke-width: 2.2; }
.lang > .lang__caret { width: 14px; height: 14px; stroke-width: 2.4; opacity: .62; transition: transform .25s var(--ch-ease), opacity .2s var(--ch-ease); }
.lang:hover > .lang__caret, .lang[aria-expanded="true"] > .lang__caret { opacity: 1; }
.lang[aria-expanded="true"] > .lang__caret { transform: rotate(180deg); }
.langdrop { left: auto; right: 0; min-width: 208px; transform: translateY(8px); }
.lang:hover .langdrop, .lang:focus-within .langdrop, .lang[aria-expanded="true"] .langdrop {
  opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0);
}
.langdrop__item { width: 100%; border: 0; background: none; font-family: inherit; text-align: left; cursor: pointer; }
.langdrop__code {
  display: grid; place-items: center;
  width: 30px; height: 22px; flex-shrink: 0;
  border-radius: 7px;
  font-size: 11px; font-weight: 500; letter-spacing: .06em;
  background: rgba(17,19,23,0.07); color: rgba(17,19,23,0.72);
}
.langdrop__item[aria-checked="true"] .langdrop__code { background: var(--ch-ink); color: #fff; }
.langdrop__item .langdrop__check { margin-left: auto; opacity: 0; }
.langdrop__item[aria-checked="true"] .langdrop__check { opacity: 1; }
@media (max-width: 1199px) { .nav--lang .lang { margin-left: auto; margin-right: 0; } .nav:not(.nav--lang) .nav__cta { margin-left: auto; } }
@media (max-width: 767px) { .lang { display: none; } }




/* =====================================================================
   FOOTER
   ===================================================================== */
.footer {
  background: var(--ch-bg);
  color: var(--ch-ink);
  border-top: 1.5px solid var(--ch-line);
  padding: 64px 28px 40px;
}
@media (min-width: 768px) { .footer { padding: 72px 56px 44px; } }
@media (min-width: 1100px){ .footer { padding: 80px 92px 48px; } }
.footer__wrap { max-width: 1160px; margin: 0 auto; }
.footer__top {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: 40px;
  padding-bottom: 44px;
  border-bottom: 1.5px solid var(--ch-line);
}
@media (max-width: 820px) { .footer__top { grid-template-columns: 1fr 1fr; gap: 36px; } }
@media (max-width: 480px) { .footer__top { grid-template-columns: 1fr; } }
.footer__brand img { height: 26px; width: auto; margin-bottom: 18px; }
.footer__desc {
  margin: 0;
  max-width: 280px;
  font-size: 13.5px;
  line-height: 1.6;
  color: var(--ch-muted);
}
.footer__col h4 {
  margin: 0 0 16px;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ch-muted);
}
.footer__col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 11px; }
.footer__col a { font-size: 15px; color: var(--ch-ink); transition: color .2s var(--ch-ease); }
.footer__col a:hover { color: var(--ch-orange); }
.footer__bottom {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  padding-top: 26px;
  font-size: 12.5px;
  color: var(--ch-muted);
}
.footer__bottom a:hover { color: var(--ch-ink); }
/* o link de preferências vinha claro do cookie-consent.css (rodapé escuro antigo) */
.footer__bottom .cookie-preferences-link { color: var(--ch-muted) !important; }
.footer__bottom .cookie-preferences-link:hover, .footer__bottom .cookie-preferences-link:focus-visible { color: var(--ch-ink) !important; }


/* =====================================================================
   FOOTER — social links
   ===================================================================== */
.footer__social { display: flex; gap: 10px; margin-top: 22px; }
.footer__social a {
  display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px;
  border-radius: 12px;
  color: var(--ch-ink);
  background: #fff;
  border: 1.5px solid var(--ch-line);
  transition: color .2s var(--ch-ease), background .2s var(--ch-ease), transform .2s var(--ch-ease);
}
.footer__social a:hover { color: #fff; background: var(--ch-orange); border-color: var(--ch-orange); transform: translateY(-2px); }
.footer__social .lucide { width: 19px; height: 19px; stroke-width: 2; }


/* As LPs de produto não carregam o reset do styles.css: links do menu e do rodapé sem sublinhado */
.nav a, .navmenu a, .footer a { text-decoration: none; color: inherit; }
.nav img, .navmenu img, .footer img { display: block; }
.nav ul, .navmenu ul, .footer ul { margin: 0; padding: 0; list-style: none; }
