/* The same state applies before, during and after hover. */
:root {
  --pangeia-header-background: transparent;
  --pangeia-header-text: #063C70;
  --pangeia-header-shadow: none;
  --pangeia-header-border: none;
  --pangeia-label-shadow: none;
}
:root[data-pangeia-hero-image="ready"]:not([data-pangeia-header="scrolled"]) {
  --pangeia-header-text: #fff;
  --pangeia-label-shadow: 0 1px 3px rgba(0, 0, 0, .8);
  /* Faixa branca que separa o menu transparente da foto do banner, igual ao site do IADE. */
  --pangeia-header-border: 1px solid rgba(255, 255, 255, .35);
}
:root[data-pangeia-header="scrolled"] {
  --pangeia-header-background: #fff;
  --pangeia-header-text: #063C70;
  --pangeia-header-shadow: 0 2px 12px rgba(0, 0, 0, .08);
  --pangeia-label-shadow: none;
}
#navbar {
  position: fixed !important;
  top: 0 !important;
  left: 0;
  width: 100%;
  transform: none !important;
  background: transparent !important;
}
#navbar .styles-module--navbarFlexWrapper--71071 {
  display: none !important;
}
#navbar .styles-module--menuFullSize--9f408 {
  height: auto !important;
  min-height: 0;
  background: transparent !important;
}
#navbarFixed {
  position: relative !important;
  top: 0 !important;
  transform: none !important;
}
#navbarFixed,
#navbar .mobileNav-module--mobileNavWrapper--7d098,
#navbar .mobileNav-module--mobileNavPrincipalWrapper--96b9f {
  background: var(--pangeia-header-background) !important;
  border-bottom: var(--pangeia-header-border) !important;
  box-shadow: var(--pangeia-header-shadow);
  transition: background-color .3s ease, box-shadow .3s ease, border-bottom .3s ease;
}
#navbarFixed,
#navbarFixed .styles-module--wrapperDesktopMenu--1212d,
#navbarFixed .desktop_menu_styles-module--menuDesktopList--5234f,
#navbarFixed .desktop_menu_styles-module--menuDesktopList--5234f > li,
#navbarFixed .desktop_menu_styles-module--menuDesktopList--5234f > li > .desktop_menu_styles-module--MenuLinkItem--7ca47 {
  opacity: 1 !important;
  visibility: visible !important;
}
#navbarFixed .desktop_menu_styles-module--menuDesktopList--5234f > li > .desktop_menu_styles-module--MenuLinkItem--7ca47,
#navbarFixed .desktop_menu_styles-module--menuDesktopList--5234f > li > .desktop_menu_styles-module--MenuLinkItem--7ca47 > span {
  color: var(--pangeia-header-text) !important;
  opacity: 1 !important;
  visibility: visible !important;
  text-shadow: var(--pangeia-label-shadow);
}
#navbarFixed .desktop_menu_styles-module--menuDesktopList--5234f > li > .desktop_menu_styles-module--MenuLinkItem--7ca47 > svg path,
#navbar .mobileNav-module--headerIcons--0cb36 > svg path {
  fill: var(--pangeia-header-text) !important;
}
@media (prefers-reduced-motion: reduce) {
  #navbarFixed,
  #navbar .mobileNav-module--mobileNavWrapper--7d098,
  #navbar .mobileNav-module--mobileNavPrincipalWrapper--96b9f {
    transition: none;
  }
}

/* O painel do menu mobile ja existe no DOM com display:none; era o Gatsby que o abria.
   Quem alterna o estado agora e o pangeia-header.js. */
:root[data-pangeia-menu="aberto"] [class*="mobileNav-module--mobileMenuContent"] {
  display: block !important;
}
:root[data-pangeia-menu="aberto"] {
  overflow: hidden;
}

/* Os submenus do menu mobile ficam com max-height:0; o pangeia-header.js marca o
   wrapper quando o utilizador toca na linha. */
[class*="mobile-module--menuLabelWrapper"][data-pangeia-sub="aberto"] [class*="mobile-module--menuMobileList"] {
  max-height: none !important;
  height: auto !important;
}
