:root {
    /* Color */
    --white-color: rgb(255,255,255);
    --dark-color: rgb(0,0,0);
    --pri-color: rgb(249, 206, 7);
    --sec-color: rgb(252, 16, 104);
    --ter-color: #1f0441;
    --qua-color: #fcab10;
    --qui-color: #0ce3e8;

    /* font */
    --font-size-s: .45rem;
    --font-size-n: .9rem;
    --font-size-m: 1.12rem;
    --font-size-l: 1.5rem;
    --font-size-xl: 2rem;
    --font-size-xxl: 2.3rem;

    /* font-weight */
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;

    /*border radius */
    --border-radius-s: 8px;
    --border-radius-m: 30px;
    --border-radius-circle: 50%;

    /* site max */
    --site-max-width: 100%;
}

@font-face {
    font-family: 'False';
    src: url(../font/False.ttf);
  }

#box5 {
    display: flex;
    background-color: var(--pri-color);
    border-radius: 0%;
    padding: 15px;
    /* margin-right: 10px; */
}

#box5 .contato h4 {
    margin: 0 0 10px 0;       
    font-size: var(--font-size-xxl);        
    text-align: center;       
    font-family: 'False';
    color: var(--dark-color);
}

/* Estilo da seção de contatos */
.contato {
    max-width: 600px;           /* Largura máxima para centralização */
    margin: 0 auto;             /* Centraliza a seção */
    padding: 20px;              /* Padding externo */
    /* text-align: left;        */
}
  
  /* Estilo do título */
.contato h4 {
    font-size: 1.5em;           /* Tamanho do título */
    margin: 0 0 20px 0;         /* Margem inferior */
}
  
  /* Estilo da lista */
.contato ul {
    list-style: none;           /* Remove marcadores padrão */
    padding: 0;                 /* Remove padding padrão */
    margin: 0;                  /* Remove margem padrão */
}
  
/* Estilo dos itens da lista */
.contato ul li {
    display: flex;              /* Alinha ícone e texto horizontalmente */
    /* align-items: center;         */
    margin-bottom: 15px;        /* Espaço entre os itens */
}

/* Estilo do link */
.contato ul li a {
    display: flex;              /* Flex no link para alinhar ícone e texto */
    /* align-items: center;         */
    text-decoration: none;      /* Remove sublinhado */
    color: #252525;             /* Cor do texto (ajuste conforme necessário) */
}

/* Estilo da imagem */
.contato ul li img {
    height: 32px;               /* Tamanho fixo do ícone */
    width: auto;                /* Mantém proporção */
    margin-right: 10px;         /* Espaço entre ícone e texto */
}
  
/* Estilo do texto */
.contato ul li span {
    font-size: var(--font-size-l);             /* Tamanho do texto */
}
  
/* Media query para telas menores */
@media (max-width: 1100px) and (orientation: portrait) {
    .contato {
      padding: 10px;
    }
  
    .contato ul li {
      margin-bottom: 10px;      /* Reduz espaçamento */
    }
  
    .contato ul li img {
      margin-top: 7px;
      height: 24px;             /* Reduz ícone em telas muito pequenas */
    }
    
    #box5 .contato h4 {
        font-size: 3.5rem;
    }

    #box5 .contato span {
      font-size: 2rem;
    }

  }