
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&family=Quicksand:wght@500;600&display=swap');

/* Colors from logo */
:root{
  --accent-green:#91c36a;
  --accent-orange:#f4a632;
  --bg-deep:#1b1f1d;
  --bg-card:#2a2f2c;
  --text-light:#ffffff;
  --text-dim:rgba(255,255,255,.6);
}

body{
  font-family:'Poppins',system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  background:var(--bg-deep);
  color:var(--text-light);
  line-height:1.6;
}

.brand-text{
  font-family:'Quicksand',sans-serif;
}
.brand-top{
  font-weight:600;
  color:var(--accent-green);
  text-transform:lowercase;
  letter-spacing:-.02em;
}
.brand-bottom{
  font-size:.7rem;
  color:var(--accent-orange);
  letter-spacing:.03em;
}

/* navbar */
.nav-blur{
  background:rgba(0,0,0,.55);
  backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(255,255,255,.07);
}
.navbar-nav .nav-link{
  font-weight:500;
  color:var(--text-light);
}
.navbar-nav .nav-link.active,
.navbar-nav .nav-link:focus,
.navbar-nav .nav-link:hover{
  color:var(--accent-green);
}
.btn-order{
  background:var(--accent-orange);
  border:0;
  color:#1b1f1d;
  border-radius:999px;
  transition:.2s;
}
.btn-order:hover{
  filter:brightness(1.05);
  color:#1b1f1d;
}

/* hero */
.hero-section {
  position: relative;
  min-height: 100vh;
  background: linear-gradient(
      rgba(27, 31, 29, 0.85),
      rgba(27, 31, 29, 0.85)
    ),
    url("../assets/img/back.jpeg") center/cover no-repeat;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 6rem;
  overflow: hidden;
}

.hero-section {
  animation: fadeHero 1.5s ease-in-out;
}

@keyframes fadeHero {
  from { opacity: 0; transform: scale(1.02); }
  to { opacity: 1; transform: scale(1); }
}

.hero-title{
  font-family:'Quicksand',sans-serif;
  color:#fff;
  line-height:1.2;
  letter-spacing:-.03em;
}
.hero-desc{
  max-width:32rem;
}
.hero-img{
  max-width:400px;
  filter:drop-shadow(0 30px 40px rgba(0,0,0,.8));
}
.hero-gradient{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 60% 60%,rgba(145,195,106,.25)0%,rgba(0,0,0,0)70%);
  mix-blend-mode:screen;
  opacity:.2;
  pointer-events:none;
}

/* about / misión visión */
.bg-section-dark{
  background:linear-gradient(#1f2421 0%,#1b1f1d 60%);
}
.section-title{
  font-family:'Quicksand',sans-serif;
  font-weight:600;
  color:#fff;
  letter-spacing:-.03em;
}
.text-accent{
  color:var(--accent-green);
}
.info-card{
  background:var(--bg-card);
  border:1px solid rgba(255,255,255,.05);
}
.about-img{
  max-width:420px;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.07);
}

/* menu */
.filter-btn{
  background:var(--bg-card);
  border:1px solid rgba(255,255,255,.07);
  color:var(--text-light);
  font-weight:500;
  border-radius:999px;
  padding:.5rem 1rem;
  transition:.2s;
}
.filter-btn.active,
.filter-btn:hover{
  background:var(--accent-green);
  color:#1b1f1d;
  border-color:var(--accent-green);
}
.food-card{
  background:var(--bg-card);
  border:1px solid rgba(255,255,255,.07);
}
.food-img{
  max-width:140px;
  filter:drop-shadow(0 20px 25px rgba(0,0,0,.8));
}
.bg-card-dark{
  background:var(--bg-card);
}
.food-body span{
  color:var(--accent-orange);
}

/* team */
.team-card{
  background:#000;
}
.team-img{
  object-fit:cover;
  height:400px;
  width:100%;
  filter:grayscale(100%);
}
.team-card:hover .team-img{
  filter:grayscale(0%);
  transition:.4s;
}
.team-overlay{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  background:rgba(0,0,0,.5);
  backdrop-filter:blur(4px);
}

/* footer */
footer{
  font-size:.95rem;
}
.footer-social:hover{
  color:var(--accent-green)!important;
}

/* small tweaks */
.text-light-emphasis{
  color:var(--text-dim)!important;
}

@media (max-width:575.98px){
  .hero-title{
    font-size:1.9rem;
  }
  .hero-img{
    max-width:320px;
  }
}

/* --- FIX SCROLL HORIZONTAL EN MOBILE --- */
html,
body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

.navbar,
.navbar > .container,
.navbar > .container-fluid {
  max-width: 100%;
  overflow-x: hidden;
}

section,
header,
footer {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

@media (max-width: 575.98px) {
  .brand-text {
    max-width: 70%;
    white-space: normal;
    word-break: break-word;
  }

  .navbar-brand {
    flex-wrap: wrap;
  }

  .team-img {
    height: 320px;
  }
}

/* evita que la columna de la imagen empuje más del ancho de pantalla */
.col-lg-6.text-center {
  max-width: 100%;
  overflow-x: hidden;
}

/* asegura que la imagen nunca cause scroll lateral */
.about-img {
  width: 100%;
  max-width: 420px;
  height: auto;
  display: block;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

/* en pantallas chicas, que respete el viewport siempre */
@media (max-width: 575.98px) {
  .about-img {
    max-width: 100%;
    border-radius: 1rem; /* opcional, mantiene look soft */
  }
}