:root{
  --rp-brand-green:#31C21E;
  --rp-brand-blue:#1E39C2;
}

/* Wordmark institucional: una sola regla para todos los encabezados. */
.brand-name,
#navFB,
.nav-logo-txt,
.gv-page-brand .rp-brand-word,
.privacy-brand .rp-brand-word{
  display:inline-flex!important;
  align-items:baseline;
  gap:.18em;
  white-space:nowrap;
}

.logo{
  color:var(--rp-brand-green)!important;
}

.logo > span{
  color:var(--rp-brand-blue)!important;
}

.rp-brand-renacer,
.brand-name .nav-renacer,
#navFB .nav-renacer,
.nav-logo-txt{
  color:var(--rp-brand-green)!important;
}

.rp-brand-pets,
.brand-name > span:last-child,
#navFB > span:last-child,
.nav-logo-txt > span{
  color:var(--rp-brand-blue)!important;
}

body.dark .rp-brand-pets,
body.dark .brand-name > span:last-child,
body.dark #navFB > span:last-child,
body.dark .nav-logo-txt > span,
html.dark .rp-brand-pets,
html.dark .brand-name > span:last-child,
html.dark #navFB > span:last-child,
html.dark .nav-logo-txt > span,
[data-theme="dark"] .rp-brand-pets,
[data-theme="dark"] .brand-name > span:last-child,
[data-theme="dark"] #navFB > span:last-child,
[data-theme="dark"] .nav-logo-txt > span{
  color:#fff!important;
}

body.dark .logo > span,
html.dark .logo > span,
[data-theme="dark"] .logo > span{
  color:#fff!important;
}

/*
 * El SVG conserva transparencias en las zonas que originalmente son blancas.
 * Esta base blanca compacta impide que esas áreas se vuelvan negras en modo
 * oscuro, sin recolorear ni modificar los trazos verde y azul del isotipo.
 */
.nav-brand > img,
#navLogo,
.gv-page-brand > img,
.privacy-brand > img{
  width:36px!important;
  height:42px!important;
  box-sizing:border-box;
  padding:2px!important;
  border-radius:11px 13px 12px 14px!important;
  background:#fff!important;
  box-shadow:
    0 0 0 1px rgba(30,57,194,.08),
    0 5px 14px rgba(30,57,194,.08);
  object-fit:contain!important;
  object-position:center!important;
  mix-blend-mode:normal!important;
}

.nav-logo::before{
  box-sizing:border-box;
  padding:2px;
  border-radius:11px 13px 12px 14px;
  background-color:#fff!important;
  background-image:url("logo-mark.svg")!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
  background-size:calc(100% - 4px) calc(100% - 4px)!important;
  box-shadow:
    0 0 0 1px rgba(30,57,194,.08),
    0 5px 14px rgba(30,57,194,.08);
}

@media(max-width:700px){
  .nav-brand > img,
  #navLogo,
  .gv-page-brand > img,
  .privacy-brand > img{
    width:32px!important;
    height:38px!important;
    padding:2px!important;
  }
}

.rp-dd__menu{opacity:0;visibility:hidden;transform:translate(-50%,8px);transition:opacity .2s ease,transform .25s cubic-bezier(.22,1,.36,1),visibility .2s}
.rp-dd:hover .rp-dd__menu,.rp-dd:focus-within .rp-dd__menu{opacity:1;visibility:visible;transform:translate(-50%,0)}
