@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Merriweather:wght@300;400;700&family=Open+Sans:wght@300;400;600;700&display=swap');

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

body{
  text-transform:none;
  color:#2E3133;
  background-color:#000;
  line-height:1.6;
  position:relative;
  overflow-x:hidden;
  background-image:url('../images/background.png');
  background-size:contain;
  background-position:center;
  background-repeat:repeat;
  font-family:'Merriweather',sans-serif
}

header{
  background-color:rgba(17,17,17,.9);
  color:#fff;
  position:sticky;
  top:0;
  z-index:1000;
  -webkit-backdrop-filter:blur(6px);
  backdrop-filter:blur(6px);
  box-shadow:0 2px 12px rgba(0,0,0,.35)
}
header .container{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:0 20px;
  position:relative
}
header .logo{width:150px;height:auto}

.hamburger{
  display:none;
  background:#111;
  border:1px solid #222;
  color:#fff;
  border-radius:12px;
  padding:8px 12px;
  line-height:1;
  box-shadow:0 6px 18px rgba(0,0,0,.25);
  transition:transform .12s ease,background .2s ease,box-shadow .2s ease
}
.hamburger:hover{background:#161616;transform:translateY(-1px);box-shadow:0 10px 24px rgba(0,0,0,.3)}
.hamburger[aria-expanded="true"]{background:#1b1b1b;transform:translateY(0);box-shadow:0 4px 14px rgba(0,0,0,.24) inset,0 8px 22px rgba(0,0,0,.32)}
.hamburger:focus-visible{outline:2px solid rgba(186,80,40,1);outline-offset:3px}

header nav ul{list-style:none;display:flex}
header nav ul li{margin-right:55px;margin-top:2%}
header nav ul li a{
  color:rgba(186,80,40,1);
  text-decoration:none;
  font-size:1em;
  font-weight:bold;
  font-family:'Merriweather',sans-serif;
  position:relative;
  transition:color .15s ease,opacity .15s ease
}
header nav ul li a.active,
header nav ul li a[aria-current="page"],
header nav ul li.current>a{color:#fff;opacity:1}
header nav ul li a.active::after,
header nav ul li a[aria-current="page"]::after,
header nav ul li.current>a::after{
  content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:rgba(186,80,40,1);border-radius:2px
}
header nav ul li a:hover{color:#fff}

.hero{width:100%;height:680px;position:relative;overflow:hidden;margin-top:-4%;background-color:#000}
.carousel-inner{width:100%;height:100%}
.carousel-inner img{width:100%;height:100%;object-fit:cover}
.carousel-control-prev-icon,.carousel-control-next-icon{background-color:rgba(255,255,255,.2);border-radius:50%;width:60px;height:60px}
.carousel-control-prev-icon:hover,.carousel-control-next-icon:hover{background-color:rgba(255,255,255,.5)}
.carousel-control-prev,.carousel-control-next{position:absolute;top:50%;transform:translateY(-50%);z-index:1000}
.carousel-control-prev{left:10px;margin-top:20%;margin-left:-5%}
.carousel-control-next{right:10px;margin-top:20%;margin-right:-5%}
.carousel-item{transition:transform .3s ease;position:relative}
.carousel-caption{
  z-index:1000;position:absolute;bottom:20px;left:50%;transform:translateX(-50%);
  text-align:center;color:#fff;background-color:rgba(0,0,0,.5);padding:10px 20px;border-radius:10px;width:80%;
  margin-left:35%;margin-bottom:15%;font-family:'Merriweather',sans-serif
}
.carousel-caption:hover{background-color:rgba(0,0,0,.9)}
.carousel-caption h3{font-size:1.5em;margin-bottom:10px}
.carousel-caption p{font-size:1em}


#sobrenos{margin:32px auto;max-width:1000px;padding:0 20px}


section{padding:60px 20px;background-color:#fff;max-width:100vw}
.container{max-width:100vw;margin:0 auto}


.team{
  padding:60px 20px;
  background-image:url('../images/background.png');
  text-align:center;
  opacity:0;
  transform:translateY(20px);
  transition:opacity 1s ease-out,transform 1s ease-out
}
.team.visible{opacity:1;transform:translateY(0)}
.team h2{font-size:1.9em;margin-bottom:40px;font-family:'Merriweather',sans-serif;color:#cbcbcb;font-weight:bold}
.team h2::after{content:"";display:block;width:90%;height:2px;background-color:#cbcbcb;margin:20px auto}
.team-members{display:flex;justify-content:space-around;gap:40px}
.team-member{
  width:45%;background-color:#fff;padding:20px;border-radius:8px;box-shadow:0 4px 8px rgba(0,0,0,.1);
  opacity:0;transform:translateY(20px);transition:opacity .8s ease-out,transform .8s ease-out
}
.team-member img{width:100%;height:auto;border-radius:8px}
.team-member h3{margin-top:15px;font-size:1.5em;color:#333;font-family:'Merriweather',sans-serif;font-weight:bold}
.team-member p{font-size:1em;color:#777;font-family:'Merriweather',sans-serif}
.team-member.visible{opacity:1;transform:translateY(0)}


footer{
  background-color:#000;color:rgba(186,80,40,1);text-align:center;padding:20px;margin-top:40px;
  font-family:'Merriweather',sans-serif
}
footer .footer-links{
  margin-top:12px;display:grid;grid-template-columns:repeat(2,auto);
  justify-content:center;align-items:center;gap:10px 28px
}
footer .footer-links a{
  text-decoration:none;color:rgba(186,80,40,1);font-weight:600;
  display:inline-flex;align-items:center;justify-content:center;gap:8px
}
footer .footer-links a:hover{color:#fff;opacity:.95}
footer .footer-links i{font-size:40px;line-height:1;color:inherit}
#direitos-reservados{margin-top: 10px}

.whatsapp-button{
  position:fixed;bottom:20px;right:20px;background-color:#25D366;color:#fff;border-radius:50%;
  padding:15px;box-shadow:0 4px 8px rgba(0,0,0,.1);font-size:30px;text-decoration:none;z-index:1000;
  transition:transform .3s ease;width:60px;height:60px;display:flex;align-items:center;justify-content:center
}
.whatsapp-button:hover{transform:scale(1.1); color: white;}
.whatsapp-button i{vertical-align:middle;font-size:30px}


.values{
  background-image:url('../images/background.png');
  text-align:center;
  font-family:'Merriweather',sans-serif;
  color:#cbcbcb;
  background-size:contain;background-position:center;background-repeat:repeat
}
.values h2{font-size:1.9em;margin:40px 0 40px 0;font-weight:bold}
.values-container{display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap}
.value{
  flex:1 1 calc(20% - 10px);
  box-sizing:border-box;
  text-align:center;
  padding:15px;
  border-radius:10px;
  box-shadow:0 4px 6px rgba(0,0,0,.1);
  margin-top:0;
  position:relative;
  overflow:hidden;
  display:block;
  background:#686767;
  border:3px solid rgba(186,80,40,1);
  border-left:7px solid rgba(186,80,40,1);
  color:#dedede;
  text-decoration:none;
  transition:background .8s ease-in-out,transform .12s ease
}
.value i{font-size:2em;color:rgba(186,80,40,1);margin-bottom:10px;display:block}
.value h3{font-size:1.1em;margin-bottom:0;text-transform:none;color:#dedede;font-weight:bold}
.value p{font-size:.9em;color:#e0e0e0;margin-top:8px;line-height:1.4;font-family:'Merriweather',sans-serif}
.value:hover{
  background:linear-gradient(to right,#a9a9a9 50%,rgba(186,80,40,1) 50%);
  background-size:200% 100%;
  background-position:right bottom;
  transform:translateY(-2px)
}
.value:hover h3,.value:hover i{color:#fff}


.section-head.full-bleed{
  inline-size:100vw;margin-inline:calc(50% - 50vw);max-width:none;
  padding:24px 20px;background:linear-gradient(to bottom,rgba(17,17,17,.7),rgba(17,17,17,1));
  color:#fff;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;
  position:static;top:auto;z-index:auto;box-shadow:0 2px 12px rgba(0,0,0,.35)
}
.section-title{
  font-family:'Merriweather',sans-serif;
  font-size:clamp(22px,2.4vw,32px);
  color:#cbcbcb;font-weight:700;
  display:inline-flex;align-items:center;gap:10px;position:relative
}
.section-title i{color:rgba(186,80,40,1)}
.section-sub{color:#ccc;font-size:1.05rem;margin-top:6px}
.section-head h2{margin:0 0 6px 0;line-height:1.2}
.section-head p{margin:0}


.fade-in{opacity:0;transform:translateY(8px);animation:fadeInUp .5s ease-out forwards}
@keyframes fadeInUp{to{opacity:1;transform:translateY(0)}}



@media (min-width:1024px){
  .values-container{gap:20px}
  .value{flex:1 1 calc(20% - 20px)}
}

@media (max-width:1024px){
  .value{flex:1 1 calc(33.33% - 15px)}
}

@media (max-width:900px){
  .values-container{gap:12px}
}

@media (max-width:768px){
  .team-members{flex-direction:column;gap:20px}
  .team-member{width:100%;margin:0 auto}
  .team-member img{max-width:100%}
  .hero{height:500px}
  .carousel-caption{font-size:.9em;bottom:10px;padding:8px 16px;width:90%;margin-bottom:8%}
  .carousel-caption h3{font-size:1.3em}
  .carousel-caption p{font-size:.9em}
  header .container{flex-direction:column;text-align:center}
  header nav ul{display:none;flex-direction:column;padding:10px 0;width:100%}
  header nav ul li{margin-right:0;margin-bottom:15px}
  .hamburger{display:block;font-size:30px;cursor:pointer;color:#fff;margin:10px auto 0;border-radius:12px;border:1px solid #111;padding:8px 12px}
  header nav ul.active{
    display:flex;flex-direction:column;gap:10px;padding:12px;margin:10px 12px 0;
    background:rgba(11,11,11,.92);border:1px solid #1d1d1d;border-radius:12px;
    box-shadow:0 16px 40px rgba(0,0,0,.35);backdrop-filter:blur(8px);
    animation:menuDrop .18s ease-out
  }
  @keyframes menuDrop{from{opacity:0;transform:translateY(-6px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
  header nav ul.active li a{display:block;padding:10px 12px;border-radius:10px;transition:background .15s ease,color .15s ease}
  header nav ul.active li a:hover{background:#151515;color:#fff}
  header nav ul li a{font-size:1.2em}
}

@media (max-width:480px){
  header nav ul li a{font-size:1.1em}
  .hamburger{font-size:28px}
  .hero{height:250px}
  .carousel-caption{font-size:.8em;bottom:10px;padding:8px 12px;width:90%;margin-bottom:10%}
  .carousel-caption h3{font-size:1.1em}
  .carousel-caption p{font-size:.8em}
  .hero h1{font-size:1.5em}
  .hero p{font-size:.9em}
  .values h2{font-size:1.4em}
  .values-container{flex-direction:column}
  .value{width:100%;margin-bottom:20px;flex:1 1 100%}
  .value h3{font-size:1em}
}

@media (max-width:420px){
  footer .footer-links{grid-template-columns:1fr;gap:8px 0}
}