/* Add font files for Audiowide */
@font-face {
  font-family: 'Audiowide';
  src: url('./fonts/Audiowide.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
:root {
  --font-family-audiowide: 'Audiowide', sans-serif;
  --font-family-roboto: 'Roboto', sans-serif;
  --azul_principal: rgba(0, 31, 63, 1);
  --azul_Secondary: rgba(26, 63, 116, 1);
  --third_blue: rgba(128, 172, 236, 1);
  --text-azul-primario: rgba(0, 31, 63, 1);
  --text-white: rgba(255, 255, 255, 1);
  --text-azul-secondary: rgba(26, 63, 116, 1);
}

.text-azul-primario {
  color: var(--text-azul-primario);
}

.text-white {
  color: var(--text-white);
}

.text-azul-secondary {
  color: var(--text-azul-secondary);
   font-weight: 700;
}


/* CSS Reset */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  width: 100%;
  min-height: 100vh;
  overflow-x: hidden;
}

img {
  max-width: 100%;
  height: auto;
}

.logo-5 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  width: 65px;
  height: auto;
}

.logo{
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  width: 120px;
  height: auto;
}

.button_text {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  font-family: var(--font-family-audiowide);
  font-weight: normal;
  font-size: 1.3rem;
  text-decoration: none;
  text-transform: none;
  color: var(--text-azul-primario);
}


.loja-online-button-9 {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 10px;
  padding: 18px 24px 18px 24px;
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  background-color: var(--azul_Secondary);
}

.menu-container-6 {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 40px;
  padding: 0px;
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.nav-bar-4 {
   position: fixed;         /* Fixa no topo */
  top: 0;                  /* Alinha ao topo */
  left: 0;                 /* Alinha à esquerda */
  right: 0;                /* Estica até a direita */
  z-index: 1000;           /* Fica sobre outros elementos */
  background-color: white; 
  
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 40px;
  padding: 8px 52px 8px 52px;
  flex-grow: 0;
  flex-shrink: 1;
  width: 100%;
  height:74px;
}

.node-12 {
  position: relative;
  width: 100%;
  height: 90vh;
  overflow: hidden;
}

.background-image-13 {
  width: 100%;      
  height: 100%;    
  object-fit: cover; 
  object-position: left;
  display: block;
}


.title {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  
  width: 80%;
  text-align: center;

  font-family: var(--font-family-audiowide);
  font-weight: normal;
  font-size: 4.375rem;
  color: var(--text-white);
}

.container_principal-11 {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 10px;
  padding: 0px;
  flex-grow: 0;
  flex-shrink: 1;
  width: 100%;
}

.node-3 {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 8px;
  padding: 0px;
  flex-grow: 0;
  flex-shrink: 1;
  width: 100%;
}

.subtitle {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  font-family: var(--font-family-audiowide);
  font-weight: normal;
  font-size: 2.25rem;
  text-decoration: none;
  text-transform: none;
  color: var(--text-azul-primario);
}

.text-20 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  font-family: var(--font-family-roboto);
  font-weight: normal;
  font-size: 1.125rem;
  text-decoration: none;
  text-transform: none;
  color: var(--text-azul-primario);
}

.title_subtitle-18 {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 16px;
  padding: 0px;
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  width:70%;
}

.rectangle-21 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  width: 100%;
position: relative;
background: linear-gradient(180deg, #0f3054, rgba(15, 48, 84, 0.78) 59.62%, #fff);
height: 17px;
}

.node-17 {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 32px;
  padding: 0px;
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  width:100%;
}

.text {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: auto;
  font-family: var(--font-family-roboto);
  font-weight: normal;
  font-size: 1.125rem;
  text-decoration: none;
  text-transform: none;
  color: var(--text-azul-primario);
}

.text-container-22 {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 0;
  width: 100%;
}


.talk-button-25 {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 10px;
  padding: 18px 24px 18px 24px;
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  background-color: var(--azul_Secondary);
}

.subtitle-logo-container {
  display: flex;
  justify-content: space-between;
  align-items: center; 
  width: 100%;;
}

.second-section-16 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 88px;
  padding: 0px;
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.node-15 {
  width:100vw;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 10px;
  padding: 120px 52px 120px 52px;
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.subtitle {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  font-family: var(--font-family-audiowide);
  font-weight: normal;
  font-size: 2.25rem;
  text-decoration: none;
  text-transform: none;
  color: var(--text-azul-primario);
}

.services-container-28{
  width: 100vw;
  background-color: rgba(42, 63, 154, 0.2);
}

.services-29 {
  padding: 52px;
  display: flex;
  flex-direction: column;
  gap: 80px;
}

.services-title-30 {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 16px;
  padding: 0px;
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.icon_1-1-35 {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  width: 120px;
  height: auto;
}


.node-33 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
  padding: 33px 46px;
  background-color: rgba(255, 255, 255, 1);
  width: 100%; 
  box-sizing: border-box;
}


.text_bold {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  font-family: var(--font-family-roboto);
  font-weight: 700;
  font-size: 1.125rem;
  text-decoration: none;
  text-transform: none;
  color: var(--text-azul-secondary);
}


.frame-19-34 {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  padding: 0;
  width: 100%;
  height: fit-content;
  box-sizing: border-box;
  overflow: hidden; 
  text-align: center;   
}

.services-content-32 {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* 3 colunas */
  gap: 24px;
  padding: 0;
  width: 100%;
  box-sizing: border-box;
}



.subtitle {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  font-family: var(--font-family-audiowide);
  font-weight: normal;
  font-size: 2.25rem;
  text-decoration: none;
  text-transform: none;
  color: var(--text-white);
}


.talk-button-61 {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 10px;
  padding: 18px 24px;
  box-sizing: border-box;
  background-color: transparent;
  border: none;
  box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 1); /* simula borda interna */
}

.talk-button-61:hover{
  background-color: var(--text-white);
}

.talk-button-61:hover .text-white {
  color: var(--azul_principal);
}

.loja-online-button-63 {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 10px;
  padding: 18px 24px 18px 24px;
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
  background-color: var(--third_blue);
}

.loja-online-button-63:hover{
  background-color: var(--text-white);
}

.node-60 {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 40px;
  padding: 0px;
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.footer-container-58 {
  margin:auto;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  gap: 24px;
  padding: 0px;
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.footer-container{
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.footer-57 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
  padding: 120px 52px 50px 52px;
  flex-grow: 0;
  flex-shrink: 1;
  width: 100%;
  background: linear-gradient(180deg, rgba(42, 63, 154, 0), rgba(15, 48, 84, 0.6) 30.18%, #0f3054), rgba(42, 63, 154, 0.2);
}

.last-section-27 {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 0px;
  flex-grow: 0;
  flex-shrink: 1;
  width: 100%;
}

.body-container-2 {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 8px 0px 0px 0px;
  flex-grow: 0;
  flex-shrink: 1;
  width: 100%;
  background-color: rgba(255, 255, 255, 1);
}


.loja-online-button-9:hover, .talk-button-25:hover{
  background-color: var(--azul_principal);
}

.text-separator{
  width:45%;
}

.hamburger {
  display: none;
  font-size: 3rem;
  background: none;
  border: none;
  cursor: pointer;
  color: #000;
}

.footer-links{
  display: flex;
  flex-direction: column;
  gap: 40px;
}
.icon-footer{
  width:30px;
  height:auto;
}

.social-media-icons {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
}

.info-container{
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 16px;
}

.footer-logo{
  width:220px;
  height:auto;
}

.a-footer{
  font-family: var(--font-family-roboto);
  font-size: 1rem;
  font-style: italic;
  color:#fff;
}
/* Esconde o menu por padrão em mobile */
.menu-container-6 {
  display: flex;
}
.no-scroll {
  overflow: hidden;
  height: 100vh;
}

.desktop-1 {
@media (max-width: 790px) {
  .footer-logo{
    width:170px;
  }

  .icon-svg{
    width:20px;
  }
  .logo-5{
    width:62px;
  }
  .icon_1-1-35{
width: 100px;
  }

  .nav-bar-4{
    height:74px;
    padding: 0px 24px 0px 24px;
  }
  .node-3{
    gap:8px;
  }
  .loja-online-button-9, .talk-button-25, .talk-button-61, .loja-online-button-63{
    padding: 12px 12px 12px 12px;
  }
  .button_text {
    font-size: 1.125rem; /* 18px */
  }
  
  .title {
    font-size: 2.25rem; /* 36px */
  }
  .node-15, .services-29{
    padding: 40px 24px 40px 24px;
  }
  .second-section-16, .services-29{
    gap:40px;
  }
  .node-17{
    gap: 16px;
  }
  .subtitle-logo-container {
    display: block; /* ou flex-direction: column, se preferir */
    text-align: center;
    justify-content: center;
    align-items: center;
    text-align:center;
  }

  .subtitle-logo-container > *, .text-container-22 > *{
    margin-bottom: 24px; 
  }
  .subtitle-logo-container > *:last-child , .text-container-22 > *:last-child{
    margin-bottom: 0;
  }

  .title_subtitle-18{
    text-align:left;
    width:100%;
  }
  .background-image-13{
    object-position: center; 
  }

  .subtitle{
    font-size: 1.5625rem; /* 25px */
    text-align:center;
  }

  .text{
    font-size: 1rem;
  }

  .logo{
    width:85px;
  }

  .text-container-22{
    display:block;
    justify-content: center;
    align-items: center;
  }
  .text-separator{
    width:100%;
  }
  .services-content-32{
    grid-template-columns: repeat(2, 1fr);
  }

  .node-60{
    gap:16px;
  }
  .icon-social-media{
    width:32px;
  }
}
@media (max-width: 480px) {
  .footer-57{
    padding: 120px 32px 50px 32px;
  }
  .a-footer{
    font-size:0.875rem;
  }
  .hamburger {
    display: block;
    font-size: 4rem;
    background: none;
    border: none;
    cursor: pointer;
    color: var(--azul_Secondary);
    z-index: 1001;
    position: relative;
    z-index: 1001;
  }

  .menu-container-6 {
    position: fixed;
    top: 74px; /* altura da nav */
    right: -100%; /* escondido fora do ecrã */
    width: 100%;
    height: calc(100vh - 64px); /* ocupa tudo menos a nav */
    background: white;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    padding: 32px 24px;
    z-index: 1000;
    transition: right 0.3s ease-in-out;
    display: flex; /* não usamos display: none, para permitir animação */
  }

  .menu-container-6.open {
    right: 0;
    top:74px;
  }

  .services-content-32{
    grid-template-columns: repeat(1, 1fr);
  }

  .button_text {
    font-size: 1.5rem; /* 16px */
  }

  .menu-container-6>a{
    font-size: 1.5rem;
  }
  .menu-container-6>div{
    padding: 16px 24px;
  }
  .menu-container-6>div>a{
    font-size: 1.5rem;
  }
}

@media (max-width: 400px) {
  .node-60 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
  }
}
}