/* Corpo do texto */
body, p, ul, li, footer {
    font-family: 'Song Myung', serif; /* Song Myung para texto normal */
    color: #444444;
    margin: 0;
    padding: 0;
    text-align: center;
    cursor: url('images/cursor.png'), auto;
  }
  body {
  background-color: #FFF5FA; /* rosa bebé suave */
}
strong,
    b {
      color: #4b2353; /* vermelho, por exemplo */
    }
a:hover, a:active {
  cursor: url('images/pointer.png'), pointer;
}
  .service-box img {
    width: 100%;
    height: auto;
    max-width: 250px; /* limite opcional */
    display: block;
    margin: 0 auto;
  }
  .service-container {
    display: flex;
    flex-wrap: wrap; /* permite quebrar linha em ecrãs pequenos */
    gap: 20px;
    justify-content: center;
  }


  
  .service-box {
    flex: 1 1 250px; /* base de 250px, cresce conforme espaço */
    max-width: 300px;
    background-color: #FFFDFC;

  }
  
  /* Containers */
  .container {
    max-width: 850px;
    margin: auto;
    padding: 20px;
  }
  
  /* Imagem do header */
  header img {
    width: 100%;
    border: 3px dotted #fcb7d4;
    margin-bottom: 20px;
    border-radius: 12px;
  }
  
  /* Navegação (Pixelify Sans) */
  nav {
    margin-bottom: 30px;
    font-size: 12px;
  }
  
  nav a {
    text-decoration: none;
    font-family: 'Pixelify Sans', sans-serif; /* Pixelify Sans para os links de navegação */
  }
  
  /* Caixas de conteúdo */
  .box {
    background-color: #FFFDFC;
    border: 2px dashed #ffc9e3;
    border-radius: 20px;
    padding: 20px;
    margin-bottom: 25px;
    box-shadow: 2px 2px 8px rgba(255, 182, 193, 0.3);
  }
  
  /* Listas */
  ul {
    list-style: none;
    padding-left: 0;
  }
  
  ul li {
    margin: 10px 0;
  }
  
  /* Decoração de imagem */
  .decor {
    margin-top: 10px;
    width: 100px;
  }
  .smile-img {
    width: 20px; /* Ajuste o tamanho conforme necessário */
    height: auto;
  }
  
  /* Footer */
  footer {
    margin-top: 20px;
    font-size: 10px;
  }
  
  /* Títulos (Trocchi) */
  h1, h2, h3 {
    font-family: 'Trocchi', serif; /* Trocchi para títulos */
    color: #da69bb;
  }
  
  .decor {
    width: 100px; /* Tamanho original da imagem */
  }
  
  .large {
    width: 300px; /* Ajuste o tamanho conforme necessário */
    height: auto; /* Para manter as proporções da imagem */
  }
    a {
    color: #fe74b0; /* Cor padrão dos links */
    text-decoration: none;
    transition: color 0.2s ease; /* Suaviza a transição */
  }
    a:hover {
      transition: color 0.2s ease; /* Suaviza a transição */
      text-decoration: none;
      color: #d795ef; /* Cor quando o mouse passa por cima */
    }
  
/* Versão responsiva para ecrãs pequenos */
/* Já existe o @media (max-width: 768px) */

/* Ajustes para o layout principal */
@media (max-width: 768px) {
  /* Faz a layout principal ficar em coluna, para o sidebar e conteúdo ficarem um em cima do outro */
  .layout {
    flex-direction: column;
    margin-top: 20px;
  }

  /* O conteúdo principal passa a 100% da largura */
  .main-content {
    width: 100% !important; /* força a largura total */
    margin-bottom: 30px;
  }

  /* O sidebar também passa a 100% da largura */
  .sidebar {
    width: 100% !important;
    margin-top: 20px;
  }

  /* Ajusta padding e alinhamento de texto no sidebar */
  .sidebar .box p, .sidebar .box li {
    text-align: center;
  }

  /* Centralizar os ícones das redes sociais */
  .sidebar .socials {
    text-align: center;
  }
}