.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}/* Start custom CSS for html, class: .elementor-element-cd261dd */@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800&display=swap");


/* ======================================================
   HEADER GLOBAL — GRUPO VNG
====================================================== */

.vng-header,
.vng-header * {
  box-sizing: border-box;
}


.vng-header {

  --header-navy: #09254b;
  --header-navy-dark: #061c3b;

  --header-blue: #1b67ce;
  --header-blue-light: #8eb8ee;

  --header-white: #ffffff;

  --header-text: #09254b;
  --header-muted: #667994;

  --header-border: rgba(9, 37, 75, 0.13);

  position: sticky;

  top: 0;

  z-index: 9999;

  width: 100%;

  margin: 0;
  padding: 0;

  font-family: "Montserrat", Arial, sans-serif !important;

}


.vng-header,
.vng-header *,
.vng-header a,
.vng-header button,
.vng-header span,
.vng-header strong,
.vng-header small {

  font-family: "Montserrat", Arial, sans-serif !important;

}


body.admin-bar .vng-header {

  top: 32px;

}


body.vng-menu-open {

  overflow: hidden;

}


.vng-header a {

  color: inherit;

  text-decoration: none !important;

}


.vng-header button {

  font: inherit;

}


.vng-header__container {

  width: 100%;

  max-width: 1500px;

  margin: 0 auto;

}



/* ======================================================
   ÁREA PRINCIPAL
====================================================== */

.vng-header__main {

  position: relative;

  z-index: 5;

  width: 100%;

  background: rgba(255, 255, 255, 0.98);

  border-bottom: 1px solid var(--header-border);

  box-shadow:
    0 6px 28px rgba(6, 28, 59, 0.06);

  backdrop-filter: blur(14px);

  -webkit-backdrop-filter: blur(14px);

  transition:
    background-color 0.25s ease,
    box-shadow 0.25s ease;

}


.vng-header--scrolled .vng-header__main {

  box-shadow:
    0 12px 35px rgba(6, 28, 59, 0.14);

}


.vng-header__main-inner {

  display: grid;

  grid-template-columns:
    minmax(350px, auto)
    minmax(0, 1fr)
    auto;

  gap: 38px;

  align-items: center;

  min-height: 118px;

  padding: 0 34px;

  transition:
    min-height 0.25s ease;

}


.vng-header--scrolled
.vng-header__main-inner {

  min-height: 96px;

}



/* ======================================================
   MARCA
====================================================== */

.vng-header__brand {

  display: inline-flex;

  align-items: center;

  gap: 20px;

  justify-self: start;

  text-decoration: none !important;

}


/* QUADRADO VNG */

.vng-header__brand-symbol {

  display: flex;

  align-items: center;

  justify-content: center;

  width: 84px;
  height: 84px;

  flex: 0 0 84px;

  color: #ffffff !important;

  background:
    var(--header-navy) !important;

  border:
    2px solid var(--header-navy);

  font-size: 25px;

  font-weight: 800;

  line-height: 1;

  letter-spacing: -0.04em;

  /*
   * Não usamos transição de cor aqui.
   * Dessa forma o quadrado permanece
   * sempre azul-escuro.
   */

  transition: none;

}


/* ======================================================
   QUADRADO VNG — SEM ALTERAÇÃO NO HOVER
====================================================== */

.vng-header__brand:hover
.vng-header__brand-symbol,

.vng-header__brand:focus
.vng-header__brand-symbol,

.vng-header__brand:focus-visible
.vng-header__brand-symbol {

  color: #ffffff !important;

  background:
    var(--header-navy) !important;

  border-color:
    var(--header-navy) !important;

  transform: none !important;

}



/* TEXTO DA MARCA */

.vng-header__brand-text strong,
.vng-header__brand-text small {

  display: block;

}


.vng-header__brand-text strong {

  margin-bottom: 8px;

  color:
    var(--header-navy);

  font-size: 35px;

  font-weight: 800;

  line-height: 1;

  letter-spacing: -0.04em;

}


.vng-header__brand-text small {

  color:
    var(--header-blue);

  font-size: 11px;

  font-weight: 700;

  line-height: 1.35;

  letter-spacing: 0.07em;

  text-transform: uppercase;

}



/* ======================================================
   MENU DESKTOP
====================================================== */

.vng-header__desktop-navigation {

  display: flex;

  align-items: center;

  justify-content: center;

  gap:
    clamp(
      22px,
      1.6vw,
      34px
    );

  min-width: 0;

}


.vng-header__desktop-navigation a {

  position: relative;

  display: inline-flex;

  align-items: center;

  min-height: 118px;

  color:
    var(--header-text);

  font-size: 17px;

  font-weight: 600;

  line-height: 1.2;

  white-space: nowrap;

  transition:
    color 0.2s ease;

}


.vng-header__desktop-navigation a::after {

  content: "";

  position: absolute;

  right: 0;
  bottom: 0;
  left: 0;

  height: 4px;

  background:
    var(--header-blue);

  transform:
    scaleX(0);

  transform-origin:
    center;

  transition:
    transform 0.25s ease;

}


.vng-header__desktop-navigation a:hover,
.vng-header__desktop-navigation a:focus {

  color:
    var(--header-blue);

}


.vng-header__desktop-navigation a:hover::after,
.vng-header__desktop-navigation a:focus::after {

  transform:
    scaleX(1);

}


.vng-header--scrolled
.vng-header__desktop-navigation a {

  min-height: 96px;

}



/* ======================================================
   AÇÕES
====================================================== */

.vng-header__actions {

  display: flex;

  align-items: center;

  gap: 15px;

  justify-self: end;

}



/* ======================================================
   CTA PREMIUM
====================================================== */

.vng-header__button {

  position: relative;

  isolation: isolate;

  display: inline-flex;

  align-items: center;

  justify-content: space-between;

  gap: 25px;

  min-width: 255px;

  min-height: 66px;

  padding:
    11px
    12px
    11px
    25px;

  overflow: hidden;

  color:
    #ffffff !important;

  background:

    linear-gradient(

      110deg,

      #0d469c 0%,

      #1b67ce 28%,

      #3184f3 48%,

      #1b67ce 68%,

      #0a3d8b 100%

    );

  background-size:
    260% 100%;

  border:
    1px solid rgba(
      111,
      178,
      255,
      0.78
    );

  box-shadow:

    0 9px 24px
    rgba(
      27,
      103,
      206,
      0.24
    ),

    0 0 0 1px
    rgba(
      255,
      255,
      255,
      0.08
    )
    inset;

  font-size: 15px;

  font-weight: 700;

  line-height: 1.2;

  animation:
    vngHeaderPremiumGradient
    7s
    ease-in-out
    infinite;

  transition:

    box-shadow 0.3s ease,

    border-color 0.3s ease,

    transform 0.3s ease;

}



/* ======================================================
   REFLEXO DO BOTÃO
====================================================== */

.vng-header__button::before {

  content: "";

  position: absolute;

  z-index: -1;

  top: -70%;

  bottom: -70%;

  left: -45%;

  width: 34%;

  opacity: 0;

  background:

    linear-gradient(

      90deg,

      transparent,

      rgba(
        255,
        255,
        255,
        0.08
      ),

      rgba(
        255,
        255,
        255,
        0.55
      ),

      rgba(
        255,
        255,
        255,
        0.08
      ),

      transparent

    );

  filter:
    blur(2px);

  transform:
    translateX(-180%)
    rotate(16deg);

  animation:
    vngHeaderPremiumShine
    5.5s
    ease-in-out
    infinite;

  pointer-events:
    none;

}



/* CONTORNO INTERNO */

.vng-header__button::after {

  content: "";

  position: absolute;

  z-index: -1;

  inset: 3px;

  border:

    1px solid

    rgba(
      255,
      255,
      255,
      0.15
    );

  pointer-events:
    none;

}


.vng-header__button-text,
.vng-header__button-arrow {

  position: relative;

  z-index: 2;

}


.vng-header__button-text {

  color:
    #ffffff !important;

}


.vng-header__button-arrow {

  display: flex;

  align-items: center;

  justify-content: center;

  width: 42px;
  height: 42px;

  flex: 0 0 42px;

  color:
    #ffffff !important;

  background:

    rgba(
      6,
      28,
      59,
      0.12
    );

  border:

    1px solid

    rgba(
      255,
      255,
      255,
      0.58
    );

  border-radius: 50%;

  font-size: 19px;

  font-weight: 400;

  line-height: 1;

  box-shadow:

    0 0 16px

    rgba(
      142,
      184,
      238,
      0.12
    );

  transition:

    color 0.3s ease,

    background-color 0.3s ease,

    box-shadow 0.3s ease,

    transform 0.3s ease;

}


.vng-header__button:hover,
.vng-header__button:focus {

  color:
    #ffffff !important;

  border-color:

    rgba(
      177,
      218,
      255,
      0.96
    );

  box-shadow:

    0 13px 30px
    rgba(
      27,
      103,
      206,
      0.35
    ),

    0 0 19px
    rgba(
      49,
      132,
      243,
      0.2
    ),

    0 0 0 1px
    rgba(
      255,
      255,
      255,
      0.12
    )
    inset;

  transform:
    translateY(-3px);

}


.vng-header__button:hover
.vng-header__button-arrow,

.vng-header__button:focus
.vng-header__button-arrow {

  color:
    #09254b !important;

  background:
    #ffffff;

  box-shadow:

    0 0 20px

    rgba(
      255,
      255,
      255,
      0.42
    );

  transform:
    rotate(45deg);

}



/* ======================================================
   ANIMAÇÃO DO DEGRADÊ
====================================================== */

@keyframes vngHeaderPremiumGradient {

  0%,
  100% {

    background-position:
      0% 50%;

  }


  50% {

    background-position:
      100% 50%;

  }

}



/* ======================================================
   ANIMAÇÃO DO REFLEXO
====================================================== */

@keyframes vngHeaderPremiumShine {

  0%,
  58% {

    left: -45%;

    opacity: 0;

    transform:
      translateX(-180%)
      rotate(16deg);

  }


  64% {

    opacity: 0.75;

  }


  82% {

    left: 128%;

    opacity: 0;

    transform:
      translateX(180%)
      rotate(16deg);

  }


  100% {

    left: 128%;

    opacity: 0;

  }

}



/* ======================================================
   BOTÃO MOBILE
====================================================== */

.vng-header__mobile-toggle {

  display: none;

  align-items: center;

  justify-content: center;

  flex-direction: column;

  gap: 6px;

  width: 54px;

  height: 54px;

  padding: 0;

  color:
    var(--header-navy);

  background:
    transparent;

  border:
    1px solid
    var(--header-border);

  border-radius: 0;

  cursor: pointer;

}


.vng-header__mobile-toggle span {

  display: block;

  width: 24px;

  height: 2px;

  background:
    var(--header-navy);

  transition:

    opacity 0.25s ease,

    transform 0.25s ease;

}


.vng-header--menu-open
.vng-header__mobile-toggle
span:nth-child(1) {

  transform:
    translateY(8px)
    rotate(45deg);

}


.vng-header--menu-open
.vng-header__mobile-toggle
span:nth-child(2) {

  opacity: 0;

}


.vng-header--menu-open
.vng-header__mobile-toggle
span:nth-child(3) {

  transform:
    translateY(-8px)
    rotate(-45deg);

}



/* ======================================================
   MENU MOBILE
====================================================== */

.vng-header__mobile-menu {

  position: fixed;

  top: 0;

  right: 0;

  z-index: 20;

  width:
    min(
      480px,
      94vw
    );

  height:
    100dvh;

  overflow-y:
    auto;

  color:
    #ffffff;

  background:
    var(--header-navy);

  box-shadow:

    -25px
    0
    70px

    rgba(
      0,
      0,
      0,
      0.28
    );

  opacity: 0;

  visibility:
    hidden;

  transform:
    translateX(105%);

  transition:

    opacity 0.3s ease,

    visibility 0.3s ease,

    transform
    0.4s
    cubic-bezier(
      0.22,
      1,
      0.36,
      1
    );

}


.vng-header--menu-open
.vng-header__mobile-menu {

  opacity: 1;

  visibility:
    visible;

  transform:
    translateX(0);

}


.vng-header__mobile-menu-inner {

  display: flex;

  flex-direction:
    column;

  min-height:
    100%;

  padding:
    34px;

}


.vng-header__mobile-heading {

  display: flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap: 30px;

  padding-bottom:
    26px;

  border-bottom:

    1px solid

    rgba(
      255,
      255,
      255,
      0.16
    );

}


.vng-header__mobile-heading > span {

  color:
    var(--header-blue-light);

  font-size:
    12px;

  font-weight:
    700;

  letter-spacing:
    0.18em;

}


.vng-header__mobile-close {

  position: relative;

  width: 48px;

  height: 48px;

  padding: 0;

  color:
    #ffffff;

  background:
    transparent;

  border:

    1px solid

    rgba(
      255,
      255,
      255,
      0.22
    );

  cursor:
    pointer;

}


.vng-header__mobile-close span {

  position:
    absolute;

  top: 50%;

  left: 50%;

  display:
    block;

  width:
    22px;

  height:
    2px;

  background:
    #ffffff;

}


.vng-header__mobile-close
span:first-child {

  transform:

    translate(
      -50%,
      -50%
    )

    rotate(45deg);

}


.vng-header__mobile-close
span:last-child {

  transform:

    translate(
      -50%,
      -50%
    )

    rotate(-45deg);

}


.vng-header__mobile-navigation {

  display:
    flex;

  flex-direction:
    column;

  margin-top:
    28px;

}


.vng-header__mobile-navigation a {

  display:
    grid;

  grid-template-columns:

    40px

    minmax(
      0,
      1fr
    )

    37px;

  gap:
    13px;

  align-items:
    center;

  min-height:
    73px;

  color:
    #ffffff;

  border-bottom:

    1px solid

    rgba(
      255,
      255,
      255,
      0.13
    );

  font-size:
    21px;

  font-weight:
    600;

  line-height:
    1.2;

  letter-spacing:
    -0.025em;

  transition:

    color 0.2s ease,

    padding 0.2s ease;

}


.vng-header__mobile-navigation a:hover,
.vng-header__mobile-navigation a:focus {

  padding-left:
    8px;

  color:
    var(--header-blue-light);

}


.vng-header__mobile-number {

  color:
    var(--header-blue-light);

  font-size:
    11px;

  font-weight:
    700;

  letter-spacing:
    0.1em;

}


.vng-header__mobile-arrow {

  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  width:
    35px;

  height:
    35px;

  border:

    1px solid

    rgba(
      255,
      255,
      255,
      0.22
    );

  border-radius:
    50%;

  font-size:
    15px;

}



/* ======================================================
   CONTATOS MOBILE
====================================================== */

.vng-header__mobile-contact {

  display:
    flex;

  flex-direction:
    column;

  gap:
    10px;

  margin-top:
    auto;

  padding-top:
    40px;

}


.vng-header__mobile-contact-label {

  margin-bottom:
    8px;

  color:
    var(--header-blue-light);

  font-size:
    11px;

  font-weight:
    700;

  letter-spacing:
    0.15em;

}


.vng-header__mobile-contact a {

  color:

    rgba(
      255,
      255,
      255,
      0.84
    );

  font-size:
    15px;

  font-weight:
    500;

}



/* ======================================================
   CTA MOBILE
====================================================== */

.vng-header__mobile-button {

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    25px;

  min-height:
    64px;

  margin-top:
    29px;

  padding:
    14px 21px;

  color:
    #ffffff !important;

  background:

    linear-gradient(

      110deg,

      #0d469c,

      #3184f3,

      #1b67ce,

      #0a3d8b

    );

  background-size:
    250% 100%;

  border:

    1px solid

    rgba(
      142,
      184,
      238,
      0.72
    );

  font-size:
    15px;

  font-weight:
    700;

  animation:

    vngHeaderPremiumGradient

    7s

    ease-in-out

    infinite;

}



/* ======================================================
   OVERLAY MOBILE
====================================================== */

.vng-header__mobile-overlay {

  position:
    fixed;

  inset:
    0;

  z-index:
    15;

  padding:
    0;

  background:

    rgba(
      2,
      13,
      30,
      0.72
    );

  border:
    0;

  opacity:
    0;

  visibility:
    hidden;

  cursor:
    pointer;

  transition:

    opacity 0.3s ease,

    visibility 0.3s ease;

}


.vng-header--menu-open
.vng-header__mobile-overlay {

  opacity:
    1;

  visibility:
    visible;

}



/* ======================================================
   DESKTOPS MENORES
====================================================== */

@media (max-width: 1450px) {

  .vng-header__main-inner {

    grid-template-columns:

      minmax(
        290px,
        auto
      )

      minmax(
        0,
        1fr
      )

      auto;

    gap:
      24px;

  }


  .vng-header__brand-symbol {

    width:
      72px;

    height:
      72px;

    flex-basis:
      72px;

    font-size:
      22px;

  }


  .vng-header__brand-text strong {

    font-size:
      28px;

  }


  .vng-header__brand-text small {

    font-size:
      9px;

  }


  .vng-header__desktop-navigation {

    gap:
      20px;

  }


  .vng-header__desktop-navigation a {

    font-size:
      15px;

  }


  .vng-header__button {

    min-width:
      220px;

    min-height:
      60px;

    padding-left:
      20px;

    font-size:
      14px;

  }

}



/* ======================================================
   TABLET E CELULAR
====================================================== */

@media (max-width: 1160px) {

  .vng-header__main-inner,
  .vng-header--scrolled
  .vng-header__main-inner {

    grid-template-columns:

      minmax(
        0,
        1fr
      )

      auto;

    min-height:
      88px;

    padding:
      0 24px;

  }


  .vng-header__desktop-navigation,
  .vng-header__button {

    display:
      none;

  }


  .vng-header__mobile-toggle {

    display:
      flex;

  }


  .vng-header__brand-symbol {

    width:
      60px;

    height:
      60px;

    flex-basis:
      60px;

    font-size:
      19px;

  }


  .vng-header__brand-text strong {

    margin-bottom:
      5px;

    font-size:
      23px;

  }


  .vng-header__brand-text small {

    font-size:
      8px;

  }

}



/* ======================================================
   CELULAR
====================================================== */

@media (max-width: 767px) {

  body.admin-bar
  .vng-header {

    top:
      46px;

  }


  .vng-header__main-inner,
  .vng-header--scrolled
  .vng-header__main-inner {

    min-height:
      80px;

    padding:
      0 17px;

  }


  .vng-header__brand {

    gap:
      12px;

  }


  .vng-header__brand-symbol {

    width:
      54px;

    height:
      54px;

    flex-basis:
      54px;

    font-size:
      17px;

  }


  .vng-header__brand-text strong {

    font-size:
      20px;

  }


  .vng-header__brand-text small {

    max-width:
      190px;

    font-size:
      7px;

    letter-spacing:
      0.04em;

  }


  .vng-header__mobile-toggle {

    width:
      50px;

    height:
      50px;

  }


  .vng-header__mobile-menu-inner {

    padding:
      25px 22px;

  }

}



/* ======================================================
   CELULARES PEQUENOS
====================================================== */

@media (max-width: 390px) {

  .vng-header__brand-text small {

    display:
      none;

  }


  .vng-header__brand-text strong {

    font-size:
      18px;

  }


  .vng-header__mobile-navigation a {

    min-height:
      66px;

    font-size:
      18px;

  }


  .vng-header__mobile-menu-inner {

    padding:
      22px 18px;

  }

}



/* ======================================================
   ACESSIBILIDADE
====================================================== */

@media (prefers-reduced-motion: reduce) {

  .vng-header *,
  .vng-header *::before,
  .vng-header *::after {

    scroll-behavior:
      auto !important;

    animation:
      none !important;

    transition:
      none !important;

  }

}/* End custom CSS */