
/* Estilos gerais */
*{margin:0;padding:0;box-sizing:border-box;font-family:Arial,sans-serif}
.clear{clear:both}
body{background-color:#fff;color:#000;line-height:1.6}
a{text-decoration:none;color:inherit}
ul{list-style:none}

/* Estilo do menu */
.menu{background-color:rgba(0,0,0);color:#fff;padding:10px 20px;display:flex;justify-content:space-between;align-items:center;position:fixed;top:0;width:100%;z-index:1000}
.menu{display:flex;justify-content:center;align-items:center;padding:22px 30px}
.menu-logo{font-size:24px;font-weight:bold;color:#fff}
.menu-links{list-style:none;display:flex;gap:40px;margin:0;padding:0}
.menu-links li{position:relative}
.menu-links a{text-decoration:none;color:#DBCAB6;font-size:1.5rem;transition:color .3s ease;font-weight:400;font-family:Montserrat}
.menu-links a:hover{color:#FFB642}
.menu-links li::after{content:'';position:absolute;left:0;bottom:-5px;width:0;height:4px;background-color:#FFB642;transition:width .3s ease}
.menu-links li:hover::after{width:100%}

.space-menu{margin-top: 98px; height: calc(100% - 150px);}

/* Estilo do menu2 */
.menu1 {
  background-color: #000; /* Cor de fundo escura */
  color: #fff;
  padding: 30px 20px;
  display: flex;
  justify-content: space-between; /* Distribui o conteúdo (logo e menu) de maneira espaçada */
  align-items: center; /* Alinha o conteúdo verticalmente */
  position: fixed;
  top: 0px;
  width: 100%;
  z-index: 1000;
  font-family: 'Montserrat', sans-serif;
}
.menu2 {
    background-color: #082D23; /* Cor de fundo escura */
    color: #fff;
    padding: 30px 20px;
    display: flex;
    justify-content: space-between; /* Distribui o conteúdo (logo e menu) de maneira espaçada */
    align-items: center; /* Alinha o conteúdo verticalmente */
    position: fixed;
    top: 0px;
    width: 100%;
    z-index: 1000;
    font-family: 'Montserrat', sans-serif;
  }

  /* Centralização de logo e links */
  .menu-center {
    display: flex;
    justify-content: center; /* Centraliza os itens no centro */
    align-items: center; /* Centraliza os itens verticalmente */
    width: 100%;
  }

  .mlogo-menu{display: none;}

  /* Estilo do logo */
  .menu-logo {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 40px;
  }

  .menu-logo img {
    height: 50px; /* Ajuste da altura do logo */
  }

  /* Links do menu */
  .menu-links {
    list-style: none;
    display: flex;
    justify-content: center; /* Centraliza os itens de menu */
    align-items: center;
    gap: 40px; /* Espaçamento entre os links */
    margin: 0;
    padding: 0;
    transition: all 0.6s ease-in-out; /* Transição suave */
  }

  .menu-links li {
    position: relative;
  }

  .menu-links a {
    text-decoration: none;
    color: #DBCAB6; /* Cor do texto */
    font-size: 1.5rem;
    font-weight: 400;
    transition: color 0.3s ease;
  }

  .menu-links a:hover, .menu-links a.active {
    color: #FFB642; /* Cor de destaque ao passar o mouse */
  }

  .menu-links li::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -5px;
    width: 0;
    height: 4px;
    background-color: #FFB642; /* Linha de destaque */
    transition: width 0.3s ease;
  }

  .menu-links li:hover::after {
    width: 100%;
  }

  /* Menu hamburguer */
  .menu-hamburger {
    display: none; /* Esconder em telas maiores */
    cursor: pointer;
    transition: transform 0.3s ease; /* Suaviza a transição do ícone */
  }

  .menu-hamburger i {
    font-size: 24px;
    color: #fff;
    width: 30px; /* Ajusta a largura do ícone */
    height: 30px; /* Ajusta a altura do ícone */
    line-height: 30px; /* Centraliza o ícone verticalmente */
    text-align: center; /* Alinha o ícone horizontalmente */
    transition: transform 0.3s ease, opacity 0.3s ease;
  }

  /* Menu Responsivo - Tela Pequena */
  @media (max-width: 768px) {

    .mlogo-menu{display: block;}
    .menu-links {
      display: block;
      width: 100%;
      position: absolute;
      top: 110px; /* Ajuste conforme necessário para o posicionamento abaixo do topo */
      left: 0;
      background-color: #082D23; /* Cor de fundo */
      text-align: center;
      opacity: 0;
      max-height: 0;
      overflow: hidden;
      z-index: 999;
    }

    .menu1 .menu-center .menu-links{background-color: #000 !important;}

    .menu-links.open {
      opacity: 1;
      max-height: 500px; /* Ajuste conforme necessário */
    }

    .menu-links li {
      margin: 0;
    }

    .menu-links a {
      padding: 15px;
      display: block;
      width: 100%;
    }

    .menu-hamburger {
      display: block; /* Exibir ícone hamburguer em telas pequenas */
      width: 30px;
        height: 30px;
    }

    /* Animação de transformação do ícone de menu */
    .menu-hamburger.open i {
      opacity: 0; /* Oculta o ícone hamburguer */
      font-size: 24px;
      color: #fff;
      width: 30px; /* Ajusta a largura do ícone */
      height: 30px; /* Ajusta a altura do ícone */
      line-height: 30px; /* Centraliza o ícone verticalmente */
      text-align: center; /* Alinha o ícone horizontalmente */
      transition: transform 0.3s ease, opacity 0.3s ease;
      top:-10px;
      position: relative;
    }

    .menu-hamburger.open::before {
      content: '\00d7'; /* Exibe o X utilizando o código Unicode */
      font-size: 30px;
      color: #fff;
      display: block;
      text-align: center;
      font-family: 'Font Awesome 5 Free', sans-serif; /* Usa o mesmo estilo do Font Awesome */
      top:-10px;
      position: relative;
    }
  }

  /* Para telas maiores que 768px (telas de desktop) */
  @media (min-width: 769px) {
    .menu-links {
      display: flex; /* Manter os links visíveis em telas grandes */
      opacity: 1;
      max-height: none;
      overflow: visible;
    }

    .menu-hamburger {
      display: none; /* Esconder ícone hamburguer em telas grandes */
    }
  }


/* Estilo da seção com a imagem */
.image-section{position:relative;margin-top:0;height:calc(100vh - 80px);margin-top:80px}
.image-section img{width:100%;height:auto;z-index:-99}
.image-section img.slide{height:100vh;overflow:hidden;position:relative;object-fit:cover;object-position: center top;}
.image-section .image-text{position:absolute;top:380px;left:50%;transform:translate(-50%,-50%);color:#fff;text-align:center}
.image-section .image-text .logo{width:400px}
.image-section .image-text .madein{display:flex;width:300px;margin-top:150px;margin:30% auto 50px}

/* Estilo da seção hero */
.hero-section{background:#142F28 url(../images/bgcerrado.png) bottom center no-repeat;color:#fff;text-align:center;padding:60px 20px;position:relative;overflow:hidden;background-size:contain}
.hero-content{margin:0 0 250px 0}
.hero-content h1{font-family:"Playfair Display",serif;font-style:italic;font-size:2.5rem;font-weight:400;letter-spacing:2px;color:#DBCAB6}
.hero-content h2{font-size:5rem;font-weight:bold;margin:10px 0 50px 0;color:#DBCAB6;margin-top:0px;top:-10px;position:relative}
.hero-content p{font-size:2rem;line-height:1.6;margin:20px 0 0 0;max-width:1200px;margin-left:auto;margin-right:auto;color:#DBCAB6;font-weight:400;font-family:Montserrat}
.hero-content .hero-button{margin-top:80px;font-family:"Playfair Display",serif;font-style:italic;font-weight:400;font-size:2rem;color:#DBCAB6;background-color:#587D51;position:relative;top:200px}
.hero-content .hero-button:hover{background-color:#578d57}
.hero-button{display:inline-block;margin-top:20px;padding:10px 20px;background-color:#587D51;color:#fff;font-weight:bold;text-decoration:none;transition:background-color .3s}
.cta-button:hover{background-color:#4DC23B}

@media (max-width: 769px) {
  .hero-content{margin:0}
  .hero-content h1{font-size:2rem;}
  .hero-content h2{font-size:3rem;}
  .hero-content p{font-size:1.5rem;}
  .hero-content .hero-button{top:10px}
}

/* Fundo com o efeito verde */
.hero-section::after{content:'';position:absolute;bottom:0;left:0;width:100%;height:150px;background:url('efeito-verde.png') no-repeat center bottom;background-size:cover;z-index:1}

/* Seção "Um Legado por Gerações" */
.legacy-section{background-color:#142F28;color:#fff;width:100%;justify-content:center}
.legacy-content{max-width:1200px;width:100%;float:none;margin:0 auto}
.legacy-title h1{font-size:2.5rem;font-weight:bold;margin:0 0 30px;text-align:center;line-height:1.3}
.legacy-main{display:flex;flex-direction:column;align-items:center;gap:30px;padding:40px 0px 60px 0px}
.legacy-photo{width:100%;display:block}
.legacy-text{text-align:center;font-size:1rem;line-height:1.8}
.legacy-text p{margin:10px 0;color:#DBCAB6;font-size:2rem;font-weight:400;font-family:Montserrat;padding-bottom:40px}
.legacy-button{padding:10px 20px;margin-top:20px;font-family:"Playfair Display",serif;font-style:italic;font-weight:400;font-size:2rem;color:#DBCAB6;background-color:#587D51;position:relative}
.legacy-button:hover{background-color:#578d57}

@media (max-width: 769px) {
  .legacy-text{width: 90%; margin: 0 5%; text-align: justify;}
  .legacy-text p{font-size: 1.2rem;}
}

/* "Nossos Cafés" */
.our-coffees-experience{display:flex;flex-direction:column;gap:20px;padding:60px 20px;background-color:#587D51;justify-content:center;align-items:center}
.our-coffees-experience h1{font-family:"Playfair Display",serif;font-style:italic;font-size:2.5rem;font-weight:400;letter-spacing:2px;color:#DBCAB6}
.our-coffees-experience h2{font-size:5rem;font-weight:bold;color:#DBCAB6;margin-top:0px;line-height:60px;position:relative}
.our-coffees-experience p{font-size:2rem;line-height:1.6;margin:0;max-width:1200px;margin-left:auto;margin-right:auto;color:#DBCAB6;font-weight:400;font-family:Montserrat;text-align: center;}
.experience-button{padding:10px 20px;margin-top:20px;font-family:"Playfair Display",serif;font-style:italic;font-weight:400;font-size:2rem;color:#DBCAB6;background-color:#142F28;position:relative}
.experience-button:hover{background-color:#0e2b1d}

@media (max-width: 769px) {
  .our-coffees-experience h1{font-size:2rem;}
  .our-coffees-experience h2{font-size:3rem;}
  .our-coffees-experience p{font-size:1.5rem;}
}

/* "Sobre Nos"*/
.tradicao-section{background:#142F28;color:#fff;text-align:center;padding:60px 20%;position:relative;overflow:hidden;background-size:contain}
.tradicao-section .verde01{background: #587D51; margin-top: 30px; padding: 60px 05%;}
.tradicao-section .verde02{background: #B4BC9B; padding: 60px 05%;}
.txt-sectio-lf{float: left; width: 50%; padding: 0 5% 60px 5%;}

.txt-sectio-lf h1{text-transform: uppercase; margin-bottom: 30px; font-size: 2rem;}
.txt-sectio-lf h1.t2m::before{content:'';position:absolute;margin-top:50px;width:30px;height:4px;background-color:#3D342E;transition:width .3s ease}
.txt-sectio-lf p, .txt-sectio-rg p{margin-bottom: 20px; font-size: 1.5rem; text-align: justify;}
.txt-sectio-lf .bege01, .txt-sectio-rg .bege01{color: #DBCAB6;}
.txt-sectio-lf .branco, .txt-sectio-rg .branco{color: #fff;}
.txt-sectio-lf .marron, .txt-sectio-rg .marron{color:#3D342E;}
.txt-sectio-lg-img{float: left; width: 50%;}
.txt-sectio-lg-img img{float: left; width: 100%;}
.txt-sectio-lg-img2{float: left; width: 50%; height: 1020px;}
.txt-sectio-lg-img2 img{float: left; width: 100%; object-fit: cover; height: 100%;}

@media (max-width: 769px) {
.txt-sectio-lf p, .txt-sectio-rg p{font-size:1.2rem;}
}

.txt-sectio-rg{float: right; width: 50%; padding: 0 5% 60px 5%;}
.txt-sectio-rg.space2{padding: 60px 5% !important;}
.txt-sectio-rg h1{text-transform: uppercase; margin-bottom: 30px; font-size: 2rem;}
.txt-sectio-rg p.space{margin-top: 124px;}

.txt-sectio-rg h1::before, .txt-sectio-rg h1.t2::before{content:'';position:absolute;margin-top:50px;width:30px;height:4px;background-color:#FFB642;transition:width .3s ease}
.txt-sectio-rg h1.t1::before{display: none;}
.txt-sectio-rg h1.t1, .txt-sectio-rg h1.t2,.txt-sectio-lf h1.t1, .txt-sectio-lf h1.t2, .txt-sectio-lf h1.t2m{text-align: left; }
.txt-sectio-rg-img{float: left; width: 50%; height: 629px;}
.txt-sectio-rg-img img{float: left; width: 100%; object-fit: cover; height: 100%;}
.txt-sectio-container-time{background: #DBCAB6; width: 100%; padding: 60px 0;}
.txt-sectio-container-time h1{color: #142F28; text-align: center;text-transform: uppercase;font-size: 2rem;}
.txt-sectio-container-time h1::before{content:'';position:absolute;margin-top:50px;width:30px;height:4px;left:calc(50% - 15px);background-color:#142F28;transition:width .3s ease; margin-bottom: 60px;}
.txt-sectio-container-time p{font-size: 1.5rem;}
.txt-sectio-container-time p.space{margin-top: 60px;}
.txt-sectio-container-time .container-time{padding:60px 20%;}
.txt-sectio-container-time .container-time p{color: #142F28; text-align: center;margin-bottom: 20px; font-size: 1.5rem; }

@media (max-width: 1920px) {
  .tradicao-section,.txt-sectio-container-time .container-time{padding:60px 10% !important;}
  .txt-sectio-container-time p{font-size: 1.2rem;}
}

@media (max-width: 1600px) {
  .tradicao-section,.txt-sectio-container-time .container-time{padding:60px 3% !important;}
}

@media (max-width: 1299px) {
  .tradicao-section,.txt-sectio-container-time .container-time{padding:60px 0% !important;}
}
@media (max-width: 799px) {
  .tradicao-section,.txt-sectio-container-time .container-time{padding:0px 0% !important;}
}
  

.container-team {width: 100%; margin: 0 auto; padding: 20px; text-align: center; color: #142F28;}


.team-members {display: grid; gap: 20px; grid-template-columns: repeat(5, 1fr); margin-top: 60px;}
.team-member {padding: 20px; border-radius: 8px; text-align: center; color: #142F28;}
.team-member img {width: 150px; height: 150px; border-radius: 50%; margin-bottom: 15px;}
.team-member h2 {margin: 0; font-size: 20px; color: #142F28; font-family:Montserrat; font-size: 1.5rem;}
.team-member p {margin: 5px 0; color: #142F28; font-size: 1.2rem;}
.team-member .role {color: #142F28;}

@media (max-width: 1024px) {
  .team-members {grid-template-columns: repeat(3, 1fr);}
}
@media (max-width: 768px) {
  .team-members {grid-template-columns: repeat(2, 1fr);}
}
@media (max-width: 480px) {
  .team-members {grid-template-columns: 1fr;}
}

@media (max-width: 769px) {
  .tradicao-section{width: 100%; padding: 60px 0 0 0;}
  .txt-sectio-lf,.txt-sectio-rg{width: 100%!important; padding-top: 60px;}
  .txt-sectio-lg-img,.txt-sectio-rg-img,.txt-sectio-lg-img2{width: 100%!important; }
  .tradicao-section .verde01{margin-top: 0;}
  .txt-sectio-rg h1,{margin-bottom: 0;}
  .txt-sectio-rg p.space{margin: 0;}
}


/* Seção "Our Coffees" */
.our-coffees{display:flex;flex-direction:column;background-color:#F4EAD1}
.our-coffees-images{display:flex;justify-content:center;gap:20px}
.image-item{flex:1;max-width:100%}
.image-item img{width:100%;height:auto}
.our-coffees-text{display:flex;justify-content:center;padding:60px 0px;max-width:1200px;margin:auto}
.image-product{flex:1;text-align:center}
.image-product img{max-width:100%;height:auto;border-radius:8px}
.text-section{flex:1;padding-left:60px}
.text-section h1{font-family:"Playfair Display",serif;font-style:italic;font-size:3rem;font-weight:400;letter-spacing:2px;color:#142F28;position:relative;top:-20px}
.text-section h2{font-size:5rem;font-weight:bold;color:#142F28;margin-top:0px;top:-25px;position:relative}
.text-section p{margin-bottom:20px;font-size:1.5rem;color:#142F28;font-weight:400;font-family:Montserrat;padding-bottom:20px}
.cta-button{padding:10px 20px;margin-top:20px;font-family:"Playfair Display",serif;font-style:italic;font-weight:400;font-size:2rem;color:#DBCAB6;background-color:#587D51;position:relative}
.cta-button:hover{background-color:#578d57}

@media (max-width: 769px) {
  .our-coffees-text{display:block}
  .image-product{width: 100%; padding-bottom: 20px;}
  .text-section{width: 90%; margin: 0 5%; padding-left:0px}
  .text-section h1{font-size: 2rem;}
  .text-section h2{font-size: 3rem;}
  .text-section p{font-size: 1.2rem; text-align: justify;}
}

/* Seção "Um Legado por Gerações" */
.experience-bg{width: 100%; background-color: #DBCAB6; padding-top: 150px;}
.experience-section{display:flex;justify-content:center;padding:0px;max-width:1200px;margin:auto;}
.experience-section .image-experience{display: block;
  float: right;
  width: 50%;object-position: center center;}
.experience-section .image-experience img{width: 100%;
  height: 100%;
  object-fit: cover;}
.experience-text-section{flex:1;padding-top:60px; padding-right:60px}
.experience-text-section h1{font-size:5rem;font-weight:bold;color:#142F28;margin-top:0px;top:-25px;position:relative}
.experience-text-section h2{font-size:5rem;font-weight:bold;color:#142F28;margin-top:0px;top:-50px;position:relative}
.experience-text-section h2:after{content: ''; position: relative; background-color: #142F28; width: 40px; height: 10px; display: block; top:-20px;}
.experience-text-section p{margin-bottom:20px;font-size:1.5rem;color:#142F28;font-weight:400;font-family:Montserrat;padding-bottom:20px; text-align: justify;}

@media (max-width: 769px) {
  .experience-text-section p
{font-size:1.2rem;}
}

.coffees-container{display:flex;flex-direction:column;background: url(../images/bg-exp.png) no-repeat top center; background-size: cover; padding: 50px 0px}
.coffees-experience{  display:flex;flex-direction:column;gap:20px;padding:100px 20px;justify-content:center;align-items:center}
.coffees-experience h1{font-family:"Playfair Display",serif;font-style:italic;font-size:2.5rem;font-weight:400;letter-spacing:2px;color:#fff}
.coffees-experience h2{font-size:5rem;font-weight:bold;color:#fff;margin-top:0px;top:-40px;position:relative}
.coffees-experience p{font-size:2rem;line-height:1.6;margin:0 0 20px 0;max-width:1200px;margin-left:auto;margin-right:auto;color:#fff;font-weight:400;font-family:Montserrat;text-align: center;}
.experience-button{padding:10px 20px;margin-top:20px;font-family:"Playfair Display",serif;font-style:italic;font-weight:400;font-size:2rem;color:#fff;background-color:#142F28;position:relative}
.experience-button:hover{background-color:#0e2b1d}

@media (max-width: 769px) {
  .experience-text-section h1{font-size: 2rem;}
  .experience-text-section h2{font-size: 2rem; top: -40px;}
  .experience-text-section h2:after{top:0}

  .coffees-experience h1{font-size: 2rem;}
  .coffees-experience h2{font-size: 3rem;}
  .coffees-experience p{font-size: 1.2rem; text-align: justify;}
}


/*CAFES DO CERRADO*/
.coffees-container-closed{display:flex;flex-direction:column;background: url(../images/bg-cafes-cerrado.png) no-repeat top center; background-size: cover; padding: 50px 0px}
.coffees-closed{  display:flex;flex-direction:column;gap:20px;padding:100px 20px;justify-content:center;align-items:center}
.coffees-closed h1{font-family:"Playfair Display",serif;font-style:italic;font-size:2.5rem;font-weight:400;letter-spacing:2px;color:#fff}
.coffees-closed h2{font-size:5rem;font-weight:bold;color:#fff;margin-top:0px;top:-40px;position:relative}
.coffees-closed p{font-size:2rem;line-height:1.6;margin:0 0 20px 0;max-width:1200px;margin-left:auto;margin-right:auto;color:#fff;font-weight:400;font-family:Montserrat;text-align: center;}
.experience-button{padding:10px 20px;margin-top:20px;font-family:"Playfair Display",serif;font-style:italic;font-weight:400;font-size:2rem;color:#fff;background-color:#142F28;position:relative}
.experience-button:hover{background-color:#0e2b1d}

@media (max-width: 769px) {
  .experience-section{width: 100%; display: block;}
  .experience-text-section{width: 100%; padding: 60px 5%;}
  .experience-section .image-experience{width: 100%; padding: 0;}
  .coffees-container{display: block;}
  .coffees-closed{ padding:10px 5%;}
  .coffees-closed p{font-size: 1.2rem; text-align: justify;}
}


/* Rodapé */
footer{background-color:#142F28;display:flex;justify-content:space-between;align-items:center;padding:20px 20px;font-family:'Arial',sans-serif}
.footer-content{float:none;margin:0 auto;width:1200px;max-width:1200px}
.logo{color:#fff;font-size:24px;font-weight:bold;display:flex;align-items:center}
.logo span{color:#f4d19f}
.logo svg{margin-left:8px}
.social-icons{display:flex;gap:15px}
.social-icons a{text-decoration:none;width:40px;height:40px;background-color:#DBCAB6;border-radius:50%;display:flex;justify-content:center;align-items:center;transition:background-color .3s}
.social-icons a:hover{background-color:#d3b48a}
.social-icons i{color:#264c3c;font-size:20px}
.footer-content{display:flex;align-items:center;gap:50px}

@media (max-width: 769px) {
  footer {
    justify-content: center; /* Centraliza os elementos dentro do footer */
    align-items: center;
    padding: 20px;
  }

  .footer-content {
    display: flex;
    flex-direction: column; /* Alinha os elementos verticalmente */
    align-items: center; /* Centraliza horizontalmente */
    gap: 20px; /* Espaçamento entre logo e social links */
    width: 100%;
    max-width: 1200px;
  }

  .logo {
    justify-content: center; /* Centraliza dentro do flex */
  }

  .social-icons {
    justify-content: center; /* Centraliza os ícones horizontalmente */
  }

}
