/* Base styles & Material Symbols
   Icon glyph comes from data-icon via ::before so Google Translate
   cannot rewrite ligature names (arrow_forward, trending_flat, …). */
.material-symbols-outlined {
  font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  white-space: nowrap;
  speak: never;
  line-height: 1;
  font-style: normal;
  font-weight: normal !important;
  letter-spacing: normal;
  text-transform: none;
  overflow: hidden;
}

.material-symbols-outlined::before {
  content: attr(data-icon);
  display: block;
  font-family: inherit;
  font-variation-settings: inherit;
  line-height: 1;
  speak: never;
}

/* Ignore any translated leftover text nodes inside icon spans */
.material-symbols-outlined font,
font.material-symbols-outlined {
  display: none !important;
}

/* Hero and Liquid Effects */
.hero-gradient {
  background: linear-gradient(
    105deg,
    rgba(0, 68, 119, 0.94) 0%,
    rgba(0, 68, 119, 0.78) 48%,
    rgba(0, 92, 158, 0.62) 100%
  );
}

:root {
  --header-bar-height: 5rem;
  --header-safe-top: env(safe-area-inset-top, 0px);
  --header-height: calc(var(--header-bar-height) + var(--header-safe-top));
}

.hero-section {
  align-items: center;
  padding-top: var(--header-height, 5rem);
  padding-bottom: max(2rem, env(safe-area-inset-bottom, 0px));
  min-height: max(650px, 85vh);
  min-height: max(650px, 85dvh);
  overflow: hidden;
}

.hero-section__bg {
  overflow: hidden;
}

.hero-section__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

/* Páginas internas — faixa de título */
.page-hero {
  padding-top: var(--header-height, 5rem);
  min-height: calc(var(--header-height, 5rem) + 12rem);
  display: flex;
  align-items: center;
  background: #004477;
}

@media (min-width: 768px) {
  .page-hero {
    min-height: calc(var(--header-height, 5rem) + 14.5rem);
  }
}

.page-hero__bg {
  overflow: hidden;
}

.page-hero__bg img {
  object-position: center 40%;
}

.page-hero__content {
  width: 100%;
  padding-block: 2rem 2.5rem;
}

@media (min-width: 768px) {
  .page-hero__content {
    padding-block: 2.5rem 3rem;
  }
}

.ocomite-stat__number {
  font-size: clamp(2.5rem, 6vw, 3.25rem);
  letter-spacing: -0.03em;
}

/* Formulário de contato — sobrescreve plugin forms do Tailwind */
.contact-form {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.contact-form > div,
.contact-form__group {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  width: 100%;
}

.contact-form__label {
  display: block;
  width: 100%;
  margin: 0 0 0.5rem;
  font-family: Inter, sans-serif;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.3;
  color: #004477;
}

.contact-form .contact-form__field,
.contact-form input.contact-form__field,
.contact-form textarea.contact-form__field {
  display: block;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0.875rem 1.125rem;
  border: 1px solid #c1c7d2;
  border-radius: 0.5rem;
  background-color: #fff;
  background-image: none;
  color: #191c1e;
  font-family: Inter, sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  box-shadow: none;
  -webkit-appearance: none;
  appearance: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.contact-form .contact-form__field::placeholder {
  color: #717781;
  opacity: 1;
}

.contact-form .contact-form__field:hover {
  border-color: #717781;
}

.contact-form .contact-form__field:focus {
  outline: none;
  border-color: #004477;
  box-shadow: 0 0 0 3px rgba(0, 68, 119, 0.15);
}

.contact-form textarea.contact-form__textarea {
  min-height: 10rem;
  resize: vertical;
  vertical-align: top;
}

.contact-form button[type="submit"] {
  align-self: flex-start;
  border-radius: 0.5rem;
}

.contact-map iframe {
  display: block;
  width: 100%;
  min-height: 320px;
}

.page-breadcrumb {
  line-height: 1.3;
}

.page-breadcrumb--on-dark a:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 2px;
  border-radius: 2px;
}

@media (max-width: 1023px) {
  body.has-header-offset .page-hero {
    padding-top: 0;
    min-height: 12rem;
  }
}

@media (max-width: 1023px) {
  body {
    padding-top: var(--header-height);
  }

  body.has-header-offset {
    padding-top: var(--header-offset, var(--header-height));
  }

  #main-header .header-bar {
    height: auto;
    min-height: var(--header-bar-height);
  }

  .hero-section {
    align-items: flex-start;
    min-height: 0;
    height: auto;
    padding-top: 1.25rem;
    padding-bottom: max(2rem, env(safe-area-inset-bottom, 0px));
    overflow: visible;
    scroll-margin-top: var(--header-height, 5rem);
  }

  .hero-section__content {
    padding-top: 0;
    padding-bottom: 0;
  }

  .hero-section__content h1 {
    font-size: clamp(1.875rem, 7.5vw, 2.375rem);
    line-height: 1.15;
    letter-spacing: -0.02em;
  }

  .hero-section__content h2 {
    font-size: clamp(1.25rem, 4.5vw, 1.5rem);
    line-height: 1.25;
  }

  .hero-section__content p {
    font-size: 1.0625rem;
    line-height: 1.55;
  }
}

/* Glassmorphism */
.glass-card {
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.3);
}

/* Mobile menu — drawer em tela cheia */
.mobile-menu-overlay {
  position: fixed;
  inset: 0;
  z-index: 100;
  pointer-events: none;
  visibility: hidden;
}

.mobile-menu-overlay.mobile-menu--open {
  pointer-events: auto;
  visibility: visible;
}

.mobile-menu-backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  padding: 0;
  margin: 0;
  background: rgba(25, 28, 30, 0.5);
  opacity: 0;
  cursor: pointer;
  transition: opacity 0.35s ease;
}

.mobile-menu-overlay.mobile-menu--open .mobile-menu-backdrop {
  opacity: 1;
}

.mobile-menu-panel {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  width: 100%;
  overflow: hidden;
  background: #fff;
  transform: translateX(-100%);
  transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  will-change: transform;
}

.mobile-menu-overlay.mobile-menu--open .mobile-menu-panel {
  transform: translateX(0);
}

.mobile-menu-panel__header {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 4.5rem;
  padding-top: max(1rem, env(safe-area-inset-top));
  padding-bottom: 1rem;
  border-bottom: 1px solid rgba(193, 199, 210, 0.5);
}

.mobile-menu-panel__logo {
  display: block;
  line-height: 0;
}

.mobile-menu-panel__logo-img {
  display: block;
  height: 2.75rem;
  width: auto;
  max-width: min(11rem, 55vw);
  object-fit: contain;
  object-position: left center;
}

.mobile-menu-panel__body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding-top: 0.5rem;
  padding-bottom: max(1.5rem, env(safe-area-inset-bottom));
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.mobile-menu-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}

.mobile-menu-list > li {
  list-style: none;
  margin: 0;
  padding: 0;
}

.mobile-menu-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  margin-right: -0.5rem;
  padding: 0.5rem;
  border: 0;
  background: transparent;
  color: #004477;
  cursor: pointer;
}

.mobile-menu-close .material-symbols-outlined {
  font-size: 28px;
  line-height: 1;
}

.mobile-menu-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 0.875rem 0;
  border-bottom: 1px solid rgba(193, 199, 210, 0.5);
  color: #414750;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: 0.01em;
  text-decoration: none;
  background: transparent;
  transition: color 0.2s ease;
}

a.mobile-menu-link {
  display: block;
}

.mobile-menu-link:hover,
.mobile-menu-link:focus-visible,
.mobile-nav-details[open] > summary.mobile-menu-link {
  color: #009966;
  outline: none;
}

.mobile-nav-details[open] > summary.mobile-menu-link .mobile-nav-chevron,
.mobile-nav-details--nested[open] > summary .mobile-nav-chevron {
  color: #009966;
}

.mobile-menu-panel__body > ul > li:last-child .mobile-menu-link,
.mobile-menu-panel__body > ul > li:last-child .mobile-nav-details {
  border-bottom: none;
}

.mobile-nav-details--nested > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  font-family: Inter, sans-serif;
  font-weight: 500;
}

.mobile-nav-sublist a.is-current,
.mobile-nav-sublist a.current-menu-item {
  color: #009966;
  font-weight: 600;
}

/* Header search — reset do plugin forms do Tailwind */
.header-search__field {
  position: relative;
}

.header-search__placeholder {
  position: absolute;
  left: 0.75rem;
  right: 2.5rem;
  top: 50%;
  transform: translateY(-50%);
  color: rgba(255, 255, 255, 0.9);
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  pointer-events: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: opacity 0.15s ease;
}

@media (min-width: 640px) {
  .header-search__placeholder {
    left: 1.25rem;
  }
}

.header-search__field:focus-within .header-search__placeholder,
.header-search__field:has(.header-search-input:not(:placeholder-shown)) .header-search__placeholder {
  opacity: 0;
}

.header-search__field .header-search-input {
  flex: 1 1 auto;
  min-width: 4.5rem;
  width: 5.75rem;
  max-width: 100%;
  padding: 0;
  margin: 0;
  border: none;
  border-radius: 0;
  background-color: transparent;
  background-image: none;
  color: #fff;
  caret-color: #fff;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  outline: none;
  box-shadow: none;
  --tw-ring-shadow: 0 0 #0000;
  --tw-ring-offset-shadow: 0 0 #0000;
  -webkit-appearance: none;
  appearance: none;
  position: relative;
  z-index: 1;
}

.header-search__field .header-search-input::placeholder {
  color: transparent;
  opacity: 0;
}

.header-search__field .header-search-input:focus {
  outline: none;
  border: none;
  box-shadow: none;
  background-color: transparent;
}

.header-search__field .header-search-input::-webkit-search-cancel-button,
.header-search__field .header-search-input::-webkit-search-decoration {
  -webkit-appearance: none;
  appearance: none;
  display: none;
}

.header-search__field:focus-within .header-search__icon {
  transform: rotate(12deg);
}

.header-search__icon {
  color: #fff;
  transition: transform 0.3s ease;
  position: relative;
  z-index: 1;
}

@media (max-width: 639px) {
  .header-search__field .header-search-input {
    width: 4.75rem;
    min-width: 3.75rem;
    font-size: 13px;
    letter-spacing: 0.04em;
  }

  .header-search__field .header-search-input::placeholder {
    font-size: 12px;
  }
}

@media (min-width: 640px) {
  .header-search__field .header-search-input {
    width: 5.75rem;
    min-width: 4.5rem;
  }
}

@media (min-width: 1024px) {
  .header-search__field .header-search-input {
    width: 6.5rem;
    min-width: 5.5rem;
  }
}

/* Header — mantém altura ao rolar (só sombra) */
#main-header {
  box-sizing: border-box;
  padding-top: constant(safe-area-inset-top);
  padding-top: env(safe-area-inset-top, 0px);
}

@supports (padding: max(0px)) {
  #main-header {
    padding-top: max(env(safe-area-inset-top, 0px), 0px);
  }
}

#main-header .header-bar {
  height: var(--header-bar-height, 5rem);
  min-height: var(--header-bar-height, 5rem);
  align-items: center;
}

@media (min-width: 1024px) {
  #main-header .header-bar {
    height: var(--header-bar-height, 5rem);
  }
}

@media (min-width: 1024px) {
  #desktop-nav {
    align-self: stretch;
    height: 100%;
    min-height: 0;
  }
}

#main-header.header--scrolled {
  box-shadow: 0 8px 24px rgba(0, 68, 119, 0.12);
}

#main-header .header-logo-wrap {
  display: flex;
  align-items: center;
  align-self: center;
  padding-block: 0;
}

/* Desktop navigation — mega menu (painel horizontal em largura total) */
.nav-mega-item {
  display: flex;
  align-items: stretch;
}

@media (min-width: 1024px) {
  #desktop-nav {
    flex-wrap: nowrap;
    overflow: visible;
  }

  #desktop-nav .nav-mega-trigger,
  #desktop-nav .nav-mega-link-simple,
  #desktop-nav .nav-lang__trigger {
    padding-left: 0.4rem;
    padding-right: 0.4rem;
    font-size: var(--nav-font-size, 14px) !important;
    letter-spacing: -0.02em;
    white-space: nowrap;
  }

  #desktop-nav .nav-mega-trigger span,
  #desktop-nav .nav-mega-link-simple span,
  #desktop-nav .nav-mega-trigger font,
  #desktop-nav .nav-mega-link-simple font {
    white-space: nowrap;
  }
}

@media (min-width: 1280px) {
  #desktop-nav .nav-mega-trigger,
  #desktop-nav .nav-mega-link-simple,
  #desktop-nav .nav-lang__trigger {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    font-size: var(--nav-font-size, 15px) !important;
    letter-spacing: -0.01em;
  }
}

.nav-mega-trigger,
.nav-mega-link-simple {
  position: relative;
  display: flex;
  align-items: center;
  height: 100%;
  min-height: 2.75rem;
  padding: 0 0.75rem;
  color: var(--cc-header-link);
  background: transparent;
  border: 0;
  cursor: pointer;
  transition: color 0.2s ease, background 0.2s ease;
  white-space: nowrap;
}

.nav-mega-trigger:hover,
.nav-mega-trigger:focus-visible,
.nav-mega-item:hover .nav-mega-trigger,
.nav-mega-item:focus-within .nav-mega-trigger {
  color: var(--cc-header-link-hover);
  background: var(--cc-header-link-hover-bg);
  outline: none;
}

.nav-mega-link-simple:hover,
.nav-mega-link-simple:focus-visible {
  color: var(--cc-header-link-hover);
  background: var(--cc-header-link-hover-bg);
  outline: none;
}

.nav-mega-trigger::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  z-index: 62;
  width: 0;
  height: 0;
  border-left: 9px solid transparent;
  border-right: 9px solid transparent;
  border-bottom: 9px solid #fff;
  transform: translate(-50%, 100%);
  opacity: 0;
  transition: opacity 0.2s ease;
  pointer-events: none;
}

.nav-mega-item:hover .nav-mega-trigger::after,
.nav-mega-item:focus-within .nav-mega-trigger::after,
#main-header:has(.nav-mega-panel:hover) .nav-mega-item:hover .nav-mega-trigger::after,
#main-header:has(.nav-mega-panel:hover) .nav-mega-item:focus-within .nav-mega-trigger::after {
  opacity: 1;
}

.nav-mega-mount {
  position: fixed;
  left: 0;
  right: 0;
  top: var(--header-height, 5rem);
  z-index: 55;
  width: 100%;
  pointer-events: none;
}

.nav-mega-mount.is-active {
  pointer-events: auto;
}

.nav-mega-mount .nav-mega-panel {
  display: none;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  width: 100%;
  background: #fff;
  border-bottom: 1px solid #c1c7d2;
  box-shadow: 0 12px 24px rgba(0, 68, 119, 0.08);
  pointer-events: none;
}

.nav-mega-mount .nav-mega-panel.is-open {
  display: block;
  pointer-events: auto;
}

.nav-mega-mount::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -0.75rem;
  height: 0.75rem;
}

.nav-mega-item.is-active .nav-mega-trigger,
.nav-mega-item.is-current .nav-mega-trigger {
  color: var(--cc-header-link-active);
  background: var(--cc-header-link-active-bg);
}

.nav-mega-item.is-active .nav-mega-trigger::after {
  opacity: 1;
}

.nav-mega-panel__inner {
  padding: 1.25rem 0 1.5rem;
}

.nav-mega-group-label {
  margin: 0.75rem 0 0.5rem;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #717781;
}

.nav-mega-group-label:first-child {
  margin-top: 0;
}

/* Mega menu — layout em colunas (referência institucional) */
.nav-mega-columns {
  display: grid;
  grid-template-columns: repeat(var(--mega-cols, 3), minmax(0, 1fr));
  column-gap: 3rem;
  row-gap: 2rem;
  align-items: start;
  width: 100%;
}

/* Duas colunas: conteúdo à esquerda, espaço fixo entre elas (Legislação, Transparência) */
.nav-mega-columns--2 {
  grid-template-columns: repeat(2, max-content);
  column-gap: 3rem;
  justify-content: start;
}

/* Quatro colunas: larguras iguais e espaçamento uniforme (Comitê, Agência de Bacia) */
.nav-mega-columns--4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: 3rem;
}

.nav-mega-col {
  min-width: 0;
}

/* Coluna sem rótulo alinhada à lista da coluna anterior (ex. resoluções em Legislação) */
.nav-mega-col--continuation {
  padding-top: 1.625rem;
}

.nav-mega-col__split {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.5rem 2.5rem;
}

.nav-mega-col__sub {
  min-width: 0;
}

.nav-mega-col .nav-mega-group-label {
  margin-top: 0;
  margin-bottom: 0.75rem;
}

.nav-mega-links {
  display: flex;
  width: 100%;
  list-style: none;
  margin: 0;
  padding: 0;
}

.nav-mega-links--inline {
  flex-flow: row wrap;
  align-items: center;
  gap: 0.625rem 1.75rem;
}

.nav-mega-links--stack {
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
}

.nav-mega-links a {
  font-size: 14px;
  line-height: 1.45;
  color: #004477;
  text-decoration: none;
  transition: color 0.15s ease;
}

.nav-mega-links--inline a {
  white-space: nowrap;
}

.nav-mega-links--stack a {
  white-space: normal;
}

.nav-mega-links a:hover,
.nav-mega-links a:focus-visible {
  color: #009966;
  outline: none;
}

.nav-mega-links a.nav-mega-link--anchor,
.mobile-nav-sublist a.mobile-nav-link--anchor {
  color: #1a5fb4;
}

.nav-mega-links a.nav-mega-link--page {
  font-weight: 600;
}

/* Mobile navigation accordion */
.mobile-nav-details {
  border-bottom: 1px solid rgba(193, 199, 210, 0.5);
}

.mobile-nav-details summary {
  list-style: none;
  cursor: pointer;
}

.mobile-nav-details summary::-webkit-details-marker {
  display: none;
}

.mobile-nav-details--nested {
  border-bottom: none;
}

.mobile-nav-panel {
  padding: 0 0 0.75rem;
}

/* Nível 2: links do painel e títulos de subgrupos (ex. Composição, Reuniões) */
.mobile-nav-panel > .mobile-nav-sublist a,
.mobile-nav-details--nested > summary {
  padding: 0.5rem 0.75rem 0.5rem 1.25rem;
  font-size: 14px;
  color: #414750;
}

/* Nível 3: itens dentro de Composição, Reuniões, Legislação, etc. */
.mobile-nav-details--nested .mobile-nav-sublist a {
  padding: 0.5rem 0.75rem 0.5rem 2rem;
  font-size: 14px;
  color: #414750;
}

.mobile-nav-section-title {
  margin-top: 0.75rem;
  margin-bottom: 0.25rem;
  padding-left: 0.75rem;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #414750;
  opacity: 0.65;
}

.mobile-nav-sublist {
  list-style: none;
  padding: 0;
  margin: 0;
}

.mobile-nav-sublist a {
  display: block;
  transition: color 0.2s ease;
}

.mobile-nav-sublist a:hover,
.mobile-nav-sublist a:focus-visible {
  color: #009966;
  outline: none;
}

.mobile-nav-details[open] > summary .mobile-nav-chevron {
  transform: rotate(180deg);
}

.mobile-nav-chevron {
  transition: transform 0.2s ease;
}

/* Navigation */
.nav-item-active {
  border-bottom: 3px solid #009966;
  color: #009966;
  font-weight: 700;
  padding-bottom: 4px;
}

/* Scrollbar styling */
::-webkit-scrollbar {
  width: 8px;
}
::-webkit-scrollbar-track {
  background: #f7f9fb;
}
::-webkit-scrollbar-thumb {
  background: var(--cc-scrollbar);
  border-radius: 4px;
}

/* Menu mobile — sem barra de rolagem (sobrescreve estilos globais acima) */
.mobile-menu-overlay,
.mobile-menu-overlay * {
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.mobile-menu-overlay ::-webkit-scrollbar,
.mobile-menu-overlay ::-webkit-scrollbar-track,
.mobile-menu-overlay ::-webkit-scrollbar-thumb {
  display: none;
  width: 0;
  height: 0;
  background: transparent;
}

/* Utility Colors */
.brand-heading-color {
  color: #00467d;
}
.footer-brand-bg {
  background-color: #00467d;
}

.footer-partners__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  opacity: 0.92;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.footer-partners__link:hover {
  opacity: 1;
  transform: translateY(-1px);
}

.footer-partners__logo {
  display: block;
  width: auto;
  max-width: 100%;
  object-fit: contain;
  object-position: center;
}

.footer-partners__logo--agevap {
  height: 3.25rem;
}

.footer-partners__logo--inea {
  height: 2.75rem;
}

.footer-partners__logo--cerhi {
  height: 2.25rem;
}

.footer-partners__logo--oga {
  height: 4.25rem;
}

@media (min-width: 768px) {
  .footer-partners__logo--agevap {
    height: 3.75rem;
  }

  .footer-partners__logo--inea {
    height: 3.1rem;
  }

  .footer-partners__logo--cerhi {
    height: 2.5rem;
  }

  .footer-partners__logo--oga {
    height: 4.75rem;
  }
}

/* Animation for Eixos Style */
.eixo-card-overlay {
  background: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.85) 0%,
    rgba(0, 0, 0, 0.4) 50%,
    transparent 100%
  );
  transition: all 0.5s ease;
}
.group:hover .eixo-card-overlay {
  background: linear-gradient(
    to top,
    rgba(0, 70, 125, 0.9) 0%,
    rgba(0, 153, 102, 0.4) 100%
  );
}

/* Transitions */
.transition-soft {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Mapa (iframe Leaflet) */
.map-viewport {
  isolation: isolate;
  min-height: 480px;
}

.map-host,
#home-map {
  position: relative;
  display: block;
  width: 100%;
  min-height: 480px;
  height: 100%;
}

#home-map iframe.medio-map-embed {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 480px;
  border: 0;
  box-sizing: border-box;
}

#home-map .map-load-message {
  pointer-events: none;
}

#od-chart,
#cond-chart {
  display: block;
  width: 100% !important;
  height: 100% !important;
}

.map-stage {
  transform-origin: center center;
  transition: transform 160ms ease;
  will-change: transform;
}

.map-layers {
  pointer-events: none;
}

.map-marker {
  position: absolute;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.map-marker-dot {
  width: 12px;
  height: 12px;
  border-radius: 9999px;
  background: #009966;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.28);
  border: 2px solid rgba(255, 255, 255, 0.95);
}

.map-marker-label {
  margin-top: 8px;
  display: inline-block;
  padding: 6px 10px;
  border-radius: 9999px;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(0, 0, 0, 0.06);
  color: #004477;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

.map-layers-panel {
  max-height: 320px;
  overflow: auto;
}

/* Language switcher (Google Translate) */
.nav-lang {
  position: relative;
  display: flex;
  align-items: stretch;
}

.nav-lang__trigger {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.15rem;
  height: 100%;
  min-height: 2.75rem;
  padding: 0 0.65rem;
  color: #414750;
  background: transparent;
  border: 0;
  cursor: pointer;
  transition: color 0.2s ease, background 0.2s ease;
}

.nav-lang__trigger:hover,
.nav-lang__trigger:focus-visible,
.nav-lang.is-open .nav-lang__trigger {
  color: #009966;
  outline: none;
}

.nav-lang__chevron {
  font-size: 18px;
  line-height: 1;
  transition: transform 0.2s ease;
}

.nav-lang.is-open .nav-lang__chevron {
  transform: rotate(180deg);
}

.nav-lang__menu {
  position: absolute;
  top: calc(100% - 0.35rem);
  right: 0;
  z-index: 70;
  min-width: 4.5rem;
  margin: 0;
  padding: 0.35rem 0;
  list-style: none;
  background: #fff;
  border: 1px solid rgba(193, 199, 210, 0.7);
  border-radius: 0.5rem;
  box-shadow: 0 10px 28px rgba(0, 68, 119, 0.14);
}

.nav-lang__option {
  display: block;
  width: 100%;
  padding: 0.5rem 0.85rem;
  border: 0;
  background: transparent;
  color: #414750;
  font: inherit;
  text-align: center;
  letter-spacing: 0.04em;
  cursor: pointer;
  transition: color 0.15s ease, background 0.15s ease;
}

.nav-lang__option:hover,
.nav-lang__option:focus-visible {
  color: #004477;
  background: rgba(0, 68, 119, 0.08);
  outline: none;
}

.nav-lang__option.is-active {
  color: #009966;
  font-weight: 600;
}

.nav-lang--mobile {
  display: block;
  border-top: 1px solid rgba(193, 199, 210, 0.45);
  margin-top: 0.25rem;
  padding-top: 0.25rem;
}

.nav-lang__trigger--mobile {
  width: 100%;
  justify-content: space-between;
  min-height: 0;
  padding: 0.875rem 0;
}

.nav-lang__menu--mobile {
  position: static;
  right: auto;
  top: auto;
  min-width: 0;
  margin: 0 0 0.75rem;
  box-shadow: none;
  border-radius: 0.5rem;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.25rem;
  padding: 0.35rem;
}

.nav-lang__menu--mobile[hidden] {
  display: none;
}

.nav-lang__option--mobile {
  text-align: center;
  border-radius: 0.35rem;
}

/* Contrast / accessibility toggle */
.nav-contrast {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  flex-shrink: 0;
  width: 2.25rem;
  height: 2.25rem;
  margin-left: 0;
  padding: 0;
  border: 0;
  border-radius: 9999px;
  background: transparent;
  color: var(--cc-header-a11y);
  cursor: pointer;
  transition: color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}

.nav-contrast .material-symbols-outlined {
  font-size: 22px;
  font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24;
}

.nav-contrast:hover,
.nav-contrast:focus-visible {
  color: var(--cc-header-a11y);
  background: color-mix(in srgb, var(--cc-header-a11y) 12%, transparent);
  outline: none;
}

.nav-contrast.is-active {
  color: var(--cc-header-a11y);
  background: color-mix(in srgb, var(--cc-header-a11y) 12%, transparent);
  box-shadow: inset 0 0 0 2px var(--cc-header-a11y);
}

.nav-contrast--mobile {
  width: 100%;
  height: auto;
  min-height: 0;
  margin: 0;
  padding: 0.875rem 0;
  border-radius: 0;
  justify-content: space-between;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: #414750;
}

.nav-contrast-mobile {
  border-top: 1px solid rgba(193, 199, 210, 0.45);
}

/* High contrast accessibility mode */
html.contrast-mode {
  color-scheme: dark;
}

html.contrast-mode body,
html.contrast-mode .bg-background,
html.contrast-mode .bg-white,
html.contrast-mode .bg-surface,
html.contrast-mode .bg-surface-container,
html.contrast-mode .bg-surface-container-low,
html.contrast-mode .bg-surface-container-high,
html.contrast-mode .bg-surface-container-highest,
html.contrast-mode #main-header,
html.contrast-mode .nav-mega-panel,
html.contrast-mode .mobile-menu-panel,
html.contrast-mode footer {
  background: #000 !important;
  background-color: #000 !important;
  color: #fff !important;
}

html.contrast-mode #main-header,
html.contrast-mode .nav-mega-panel,
html.contrast-mode .mobile-menu-panel {
  border-color: #fff !important;
}

html.contrast-mode .text-on-background,
html.contrast-mode .text-on-surface,
html.contrast-mode .text-on-surface-variant,
html.contrast-mode .text-outline,
html.contrast-mode .brand-heading-color,
html.contrast-mode .text-primary,
html.contrast-mode h1,
html.contrast-mode h2,
html.contrast-mode h3,
html.contrast-mode h4,
html.contrast-mode h5,
html.contrast-mode p,
html.contrast-mode li,
html.contrast-mode span,
html.contrast-mode label {
  color: #fff !important;
}

html.contrast-mode a,
html.contrast-mode .text-secondary,
html.contrast-mode .hover\:text-secondary:hover,
html.contrast-mode .nav-mega-link-simple,
html.contrast-mode .nav-mega-trigger,
html.contrast-mode .nav-lang__trigger,
html.contrast-mode .mobile-menu-link {
  color: #ffff00 !important;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

html.contrast-mode a:hover,
html.contrast-mode a:focus-visible {
  color: #fff !important;
  background: #000066 !important;
  outline: 2px solid #ffff00 !important;
}

html.contrast-mode .bg-primary,
html.contrast-mode .bg-primary-container,
html.contrast-mode .bg-secondary,
html.contrast-mode .bg-tertiary,
html.contrast-mode .header-search__field,
html.contrast-mode button.bg-secondary,
html.contrast-mode .bg-secondary\/90 {
  background: #ffff00 !important;
  background-color: #ffff00 !important;
  color: #000 !important;
  border: 2px solid #fff !important;
}

html.contrast-mode .header-search__placeholder,
html.contrast-mode .header-search-input,
html.contrast-mode .header-search__icon {
  color: #000 !important;
}

html.contrast-mode .nav-contrast {
  color: #ffff00 !important;
}

html.contrast-mode .nav-contrast.is-active {
  background: #ffff00 !important;
  color: #000 !important;
  box-shadow: none;
}

html.contrast-mode .nav-lang__menu,
html.contrast-mode .nav-lang__option {
  background: #000 !important;
  color: #ffff00 !important;
  border-color: #fff !important;
}

html.contrast-mode .nav-lang__option:hover,
html.contrast-mode .nav-lang__option.is-active {
  background: #ffff00 !important;
  color: #000 !important;
}

html.contrast-mode .border,
html.contrast-mode .border-outline-variant\/30,
html.contrast-mode .border-outline-variant\/40,
html.contrast-mode [class*="border-"] {
  border-color: #fff !important;
}

html.contrast-mode .hero-section,
html.contrast-mode .page-hero,
html.contrast-mode .hero-gradient {
  background: #000 !important;
}

html.contrast-mode .hero-section__bg,
html.contrast-mode .page-hero__bg,
html.contrast-mode .hero-section img,
html.contrast-mode .page-hero img {
  filter: grayscale(1) contrast(1.35);
  opacity: 0.45;
}

html.contrast-mode .rounded-full,
html.contrast-mode .rounded-lg,
html.contrast-mode .rounded-3xl,
html.contrast-mode [class*="rounded"] {
  box-shadow: none !important;
}

html.contrast-mode .shadow-xl,
html.contrast-mode .shadow-2xl,
html.contrast-mode .shadow-lg,
html.contrast-mode .shadow-sm,
html.contrast-mode [class*="shadow"] {
  box-shadow: none !important;
}

html.contrast-mode img:not(.header-logo-wrap img):not(.mobile-menu-panel__logo-img) {
  filter: grayscale(1) contrast(1.25);
}

html.contrast-mode .header-logo-wrap img,
html.contrast-mode .mobile-menu-panel__logo-img {
  filter: grayscale(1) brightness(2) contrast(1.2);
}

html.contrast-mode *:focus-visible {
  outline: 3px solid #ffff00 !important;
  outline-offset: 2px !important;
}

/* Hide default Google Translate chrome */
#google_translate_element,
.goog-te-banner-frame,
.goog-te-balloon-frame,
.goog-te-menu-frame,
body > .skiptranslate,
.goog-logo-link,
.goog-te-gadget {
  display: none !important;
}

html.translated-ltr,
html.translated-rtl {
  margin-top: 0 !important;
}

body {
  top: 0 !important;
  position: static !important;
  min-height: 100% !important;
}

/* GT <font> tags must not break flex rows / buttons */
font {
  background-color: transparent !important;
  box-shadow: none !important;
  vertical-align: inherit !important;
}

#main-header font,
.hero-section font,
button font,
a font {
  margin: 0 !important;
  padding: 0 !important;
  line-height: inherit !important;
}

/* Tighter desktop nav when page is translated (longer labels) */
html.translated-ltr #desktop-nav .nav-mega-trigger,
html.translated-rtl #desktop-nav .nav-mega-trigger,
html.translated-ltr #desktop-nav .nav-mega-link-simple,
html.translated-rtl #desktop-nav .nav-mega-link-simple,
html.translated-ltr #desktop-nav .nav-lang__trigger,
html.translated-rtl #desktop-nav .nav-lang__trigger {
  padding-left: 0.28rem;
  padding-right: 0.28rem;
  font-size: 11px;
  letter-spacing: -0.03em;
}

@media (min-width: 1280px) {
  html.translated-ltr #desktop-nav .nav-mega-trigger,
  html.translated-rtl #desktop-nav .nav-mega-trigger,
  html.translated-ltr #desktop-nav .nav-mega-link-simple,
  html.translated-rtl #desktop-nav .nav-mega-link-simple,
  html.translated-ltr #desktop-nav .nav-lang__trigger,
  html.translated-rtl #desktop-nav .nav-lang__trigger {
    padding-left: 0.4rem;
    padding-right: 0.4rem;
    font-size: 12px;
  }
}


/* Mapa do Site */
.sitemap-section__title {
  font-family: Montserrat, sans-serif;
  font-size: 1.35rem;
  font-weight: 700;
  color: #004477;
  margin: 0 0 1rem;
  padding-bottom: 0.65rem;
  border-bottom: 2px solid rgba(0, 153, 102, 0.35);
}

.sitemap-section__title a {
  color: inherit;
  text-decoration: none;
}

.sitemap-section__title a:hover,
.sitemap-section__title a:focus-visible {
  color: #009966;
  outline: none;
}

.sitemap-section__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem 2rem;
}

@media (min-width: 640px) {
  .sitemap-section__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .sitemap-section__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.sitemap-group__title {
  font-family: Inter, sans-serif;
  font-size: 0.95rem;
  font-weight: 600;
  color: #009966;
  margin: 0 0 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.sitemap-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
}

.sitemap-list a {
  color: #414750;
  text-decoration: none;
  font-size: 0.98rem;
  line-height: 1.4;
  transition: color 0.15s ease;
}

.sitemap-list a:hover,
.sitemap-list a:focus-visible {
  color: #004477;
  text-decoration: underline;
  text-underline-offset: 0.15em;
  outline: none;
}

/* Floating contact button */
.contact-fab {
  position: fixed;
  right: max(0.75rem, env(safe-area-inset-right, 0px));
  bottom: max(0.75rem, env(safe-area-inset-bottom, 0px));
  z-index: 45;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3.25rem;
  height: 3.25rem;
  border-radius: 9999px;
  background: #009966;
  color: #fff;
  box-shadow: 0 10px 28px rgba(0, 68, 119, 0.28);
  text-decoration: none;
  transition: transform 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}

.contact-fab:hover,
.contact-fab:focus-visible {
  background: #007a52;
  transform: translateY(-2px) scale(1.04);
  box-shadow: 0 14px 32px rgba(0, 68, 119, 0.34);
  outline: none;
}

.contact-fab:focus-visible {
  outline: 3px solid #004477;
  outline-offset: 3px;
}

.contact-fab__icon {
  font-size: 1.55rem;
  line-height: 1;
  font-variation-settings: "FILL" 1, "wght" 400, "GRAD" 0, "opsz" 24;
}

html.contrast-mode .contact-fab {
  background: #ffff00 !important;
  color: #000 !important;
  border: 2px solid #fff;
  box-shadow: none;
}

@media (min-width: 768px) {
  .contact-fab {
    width: 3.5rem;
    height: 3.5rem;
    right: max(1rem, env(safe-area-inset-right, 0px));
    bottom: max(1rem, env(safe-area-inset-bottom, 0px));
  }

  .contact-fab__icon {
    font-size: 1.7rem;
  }
}