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

    :root{
      --primary:#cd0003;
      --dark:#111111;
      --text:#333333;
      --light:#f5f5f5;
      --border:#e5e5e5;
    }

    body{
      font-family:'Inter',sans-serif;
      color:var(--text);
      background:#fff;
      overflow-x:hidden;
    }

    section{
      width:100%;
    }

    .container{
      width:90%;
      max-width:1300px;
      margin:auto;
    }

    /* INFO */
.stat i{
    font-size: 42px;
    color: #cd0003;
    margin-bottom: 18px;
}

.info-icon i{
    font-size: 38px;
    color: #cd0003;
}
.stat{
    text-align: center;
    padding: 25px;
}

.stat i{
    font-size: 42px;
    color: #cd0003;
    margin-bottom: 18px;
}

.stat h3{
    font-size: 3rem;
    color: #cd0003;
    margin-bottom: 12px;
}

.stat p{
    line-height: 1.7;
    font-weight: 500;
}
.info-icon{
    min-width: 70px;
    height: 70px;
    border: 2px solid #cd0003;
    border-radius: 18px;

    display: flex;
    align-items: center;
    justify-content: center;
}

.info-icon i{
    font-size: 34px;
    color: #cd0003;
}

    .info-section{
      padding:70px 0;
      border-top:1px solid var(--border);
      border-bottom:1px solid var(--border);
      background:#fff;
    }

    .info-grid{
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:50px;
    }

    .info-card{
      display:flex;
      gap:25px;
      align-items:flex-start;
    }

    .info-icon{
      min-width:70px;
      height:70px;
      border:2px solid var(--primary);
      border-radius:18px;
      display:flex;
      align-items:center;
      justify-content:center;
      color:var(--primary);
      font-size:2rem;
      font-weight:700;
      margin-top: 25px;
    }

    .info-card p{
      line-height:1.8;
      font-size:1.05rem;
      text-align: justify;
    }

    /* TITLE */

    .section-title{
      text-align:center;
      margin-bottom:60px;
    }

    .section-title h2{
      font-size:3rem;
      color:var(--dark);
      margin-bottom:18px;
    }

    .section-title .line{
      width:90px;
      height:5px;
      background:var(--primary);
      margin:auto;
      border-radius:50px;
    }

    /* SERVICES */

    .services{
      padding:90px 0;
      background:#fafafa;
    }

    .services-grid{
      display:grid;
      grid-template-columns:repeat(5,1fr);
      gap:22px;
    }

    .service-card{
      background:#fff;
      border-radius:28px;
      overflow:hidden;
      box-shadow:0 5px 20px rgba(0,0,0,0.06);
      transition:0.3s;
      position:relative;
    }

    .service-card:hover{
      transform:translateY(-8px);
    }

    .service-number{
      position:absolute;
      top:15px;
      left:15px;
      width:42px;
      height:42px;
      border-radius:50%;
      background:var(--primary);
      color:#fff;
      font-weight:700;
      display:flex;
      align-items:center;
      justify-content:center;
      z-index:2;
    }

    .service-card img{
      width:100%;
      height:210px;
      object-fit:cover;
    }

    .service-content{
      padding:28px;
    }

    .service-content h3{
      color:var(--dark);
      margin-bottom:16px;
      font-size:1.1rem;
      line-height:1.5;
    }

    .service-content p{
      line-height:1.8;
      font-size:0.95rem;
    }

    /* COORDENADOoR */

    .coordinator{
      padding:100px 0;
    }

    .coordinator-box{
      background:#f8f8f8;
      border-radius:35px;
      padding:60px;
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:50px;
      align-items:center;
    }

    .tag{
      color:var(--primary);
      font-weight:700;
      text-transform:uppercase;
      letter-spacing:1px;
      margin-bottom:25px;
      display:block;
    }

    .coordinator h2{
      font-size:3.2rem;
      line-height:1.1;
      margin-bottom:30px;
      color:var(--dark);
    }

    .coordinator p{
      line-height:1.9;
      margin-bottom:18px;
      font-size:1.02rem;
    }

    .btn{
      display:inline-flex;
      align-items:center;
      gap:12px;
      padding:18px 30px;
      background:var(--primary);
      color:#fff;
      text-decoration:none;
      border-radius:14px;
      font-weight:600;
      margin-top:20px;
      transition:0.3s;
    }

    .btn:hover{
      opacity:0.9;
      transform:translateY(-3px);
    }

    .coordinator-image img{
      width:100%;
      border-radius:28px;
      object-fit:cover;
    }

    /* STATS */

    .stats{
      padding:70px 0;
      border-top:1px solid var(--border);
    }

.stats-grid {
display: flex;
      justify-content: center;
      flex-wrap: wrap;
      gap: 60px;
    }
    .stat{
      text-align:center;
      padding:25px;
    }

    .stat h3{
      font-size:3rem;
      color:var(--primary);
      margin-bottom:12px;
    }

    .stat p{
      line-height:1.7;
      font-weight:500;
    }

    /* FOOTER */

    footer{
      background:linear-gradient(135deg,#8f0002,#cd0003);
      color:#fff;
      padding:70px 0;
      margin-top:40px;
    }
/* GRID --O QUE FAZEMOS */
    .what-we-do-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr); /* 4 colunas lado a lado */
      gap: 25px;
    }

.what-we-do-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr); 
    gap: 25px;
}


.service-content h3 {
    text-align: center;
    color: var(--primary); 
    margin-bottom: 15px;    
}



/* aajuste do texto */
.service-content p {
    text-align: justify;        
    line-height: 1.6;       
     
    font-size: 0.95rem;
    color: #444;
}
.footer-link-lattes {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    color: #ddd; /* Começa com o cinza padrão */
    transition: color 0.3s ease; /* Transição suave para o texto */
}

/* 2. Estilo padrão da IMAGEM do Lattes (Efeito Cinza Claro) */
.lattes-img {
    width: 16px;
    height: 16px;
    object-fit: contain;
    display: inline-block;
    vertical-align: middle;
        margin-left: -2px;
    /* Deixa o ícone cinza claro (#ddd) para combinar com o texto inicial */
    filter: brightness(0) invert(0.85); 
    
    transition: filter 0.3s ease; /* Transição suave para a imagem */
}
.footer-link-lattes:hover {
    color: white; /* Texto fica branco */
}

.footer-link-lattes:hover .lattes-img {
    filter: brightness(0) invert(1); /* Imagem fica 100% branca */
}

    .footer-content{
      display:flex;
      justify-content:space-between;
      gap:40px;
      flex-wrap:wrap;
    }

    .footer-left{
      max-width:500px;

    }

    .footer-left h3{
      font-size:2rem;
      margin-bottom:20px;
    }

    .footer-left p{
      line-height:1.9;
      font-size:1.05rem;
    }

    .footer-right p{
      margin-bottom:15px;
      font-size:1rem;
    }

    .footer-bottom {
    text-align: center;
    margin-top: 60px; /* Afasta dos itens de cima */
    padding-top: 25px; /* Espaço interno superior */
    border-top: 1px solid rgba(255, 255, 255, 0.2); /* Linha divisória bem suave */
    font-size: 0.9rem;
    color: #e0e0e0;
}

.footer-bottom p {
    margin-bottom: 8px;
}


.footer-bottom a {
    color: rgba(255, 255, 255, 0.897);
    font-weight: 480;
    text-decoration: none;
    transition: 0.3s;
   
}

.footer-bottom a:hover {
    color: #ffdddd; 
    text-decoration: underline;
}

    /* RESPONSIVO */

    @media(max-width:1200px){
.what-we-do-grid {
        grid-template-columns: repeat(2, 1fr); 
      }
      .services-grid{
        grid-template-columns:repeat(2,1fr);
      }

      .stats-grid{
        grid-template-columns:repeat(2,1fr);
      }
    }

    @media(max-width:900px){
.what-we-do-grid {
        grid-template-columns: 1fr; 
      }

      .info-grid,
      .coordinator-box{
        grid-template-columns:1fr;
      }

      .services-grid{
        grid-template-columns:1fr;
      }

      .stats-grid{
        grid-template-columns:1fr;
      }

      .coordinator-box{
        padding:35px;
      }
      .about-hero {
        min-height: 500px; 
    }
    
    .hero-image {
        height: 500px;

        background: 
            linear-gradient(to bottom, rgba(255,255,255,0.9) 0%, rgba(255,255,255,0.4) 100%),
            url('images/others/home2.jpg') center/cover no-repeat;
    }
    
    .hero-title {
        font-size: 2.8rem; 
    }
  }
    @media (max-width: 400px) {
    
    /* Traz as setas um pouquinho mais para dentro no celular para não sumirem */
    .modal-carousel-btn.prev { 
        left: 5px !important; 
    }
    .modal-carousel-btn.next { 
        right: 5px !important; 
    }

        /* Força o container do modal a colar nas bordas da tela */
        .modal-content {
            width: 100% !important;
            max-width: 100% !important;
            margin: 0 !important;
            border-radius: 0 !important; /* Remove as bordas arredondadas externas */
            padding: 0 !important;
        }

        /* Garante que o container da foto use toda a largura disponível */
        .modal-images-container, 
        .carousel { 
            width: 100% !important;
            max-width: 100% !important;
            padding: 0 !important;
            margin: 0 !important;
        }

        /* Remove o arredondado e as margens da foto para ela colar na tela */
        .modal-images-container img,
        .carousel img {
            width: 100% !important;
            max-width: 100% !important;
            border-radius: 0 !important; 
            margin: 0 !important;
        }
        
        /* Opcional: Ajusta o cabeçalho do modal para não colar grudado nas letras */
        .modal-header, .footer-title {
            padding-left: 15px;
            padding-right: 15px;
        }
    }