:root{
  --green:#12452f;
  --green-2:#1f6f49;
  --berry:#9b174f;
  --berry-2:#d8296b;
  --cream:#f8f4ea;
  --text:#26332b;
  --muted:#66736b;
  --white:#ffffff;
  --shadow:0 18px 45px rgba(18,69,47,.12);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Arial, Helvetica, sans-serif;
  color:var(--text);
  background:var(--cream);
  line-height:1.6;
}

.container{width:min(1120px,92%);margin:auto}

.site-header{
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(12px);
  box-shadow:0 6px 25px rgba(0,0,0,.06);
}

.nav{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 0;
}

.brand{display:flex;align-items:center;text-decoration:none}

.logo-img{
  height:clamp(70px, 7vw, 110px);
  width:auto;
  object-fit:contain;
  display:block;
}

nav{display:flex;gap:22px;align-items:center}
nav a{color:var(--green);text-decoration:none;font-weight:700}

#menu-toggle{display:none}
.menu-btn{display:none;font-size:32px;color:var(--green);cursor:pointer}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  border:none;
  border-radius:999px;
  padding:12px 21px;
  background:linear-gradient(135deg,var(--green-2),var(--green));
  color:white!important;
  text-decoration:none;
  font-weight:800;
  cursor:pointer;
  transition:.25s ease;
}

.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.btn-small{padding:9px 16px}
.btn-outline-light{background:rgba(255,255,255,.15);border:2px solid rgba(255,255,255,.45);color:white!important}
.btn-whatsapp{background:#24c063;width:100%;margin-top:10px}

.eyebrow{
  text-transform:uppercase;
  letter-spacing:.16em;
  color:var(--berry);
  font-size:.76rem;
  font-weight:900;
  margin:0 0 12px;
}

h1{font-size:clamp(2.1rem,4vw,3.6rem);line-height:1.08;margin:0 0 20px;color:var(--green)}
h2{font-size:clamp(1.8rem,3vw,2.8rem);line-height:1.12;margin:0 0 20px;color:var(--green)}
h3{color:var(--green);margin-top:0}

.hero-slider{
  position:relative;
  height:78vh;
  min-height:520px;
  overflow:hidden;
  background:#071d15;
}

.slide{
  position:absolute;
  inset:0;
  opacity:0;
  transition:opacity .85s ease;
  background-size:cover;
  background-position:center;
  display:flex;
  align-items:center;
}

.slide::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, rgba(7,29,21,.83), rgba(7,29,21,.42), rgba(7,29,21,.08));
}

.slide.active{
  opacity:1;
  z-index:1;
}

/* Imágenes solo de berries */
.slide-1{
  background-image:url('https://images.unsplash.com/photo-1498557850523-fd3d118b962e?auto=format&fit=crop&w=1600&q=85');
}
.slide-2{
  background-image: url('berries.png');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.slide-3{
  background-image:url('https://images.unsplash.com/photo-1464965911861-746a04b4bca6?auto=format&fit=crop&w=1600&q=85');
}

.slide-content{
  position:relative;
  z-index:2;
  width:min(1120px,92%);
  margin:auto;
  color:white;
  max-width:690px;
}

.slide-content .eyebrow{color:#ffd6ea}
.slide-content h1{color:white}
.slide-content p{
  font-size:clamp(1rem,1.5vw,1.12rem);
  max-width:590px;
  color:rgba(255,255,255,.92);
}

.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}

.slider-btn{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:3;
  width:48px;
  height:48px;
  border:none;
  border-radius:50%;
  background:rgba(255,255,255,.9);
  color:var(--green);
  font-size:34px;
  line-height:1;
  cursor:pointer;
  transition:.25s ease;
}

.slider-btn:hover{transform:translateY(-50%) scale(1.06)}
.prev{left:24px}
.next{right:24px}

.dots{
  position:absolute;
  bottom:26px;
  left:50%;
  transform:translateX(-50%);
  z-index:3;
  display:flex;
  gap:10px;
}

.dot{
  width:12px;
  height:12px;
  border-radius:50%;
  background:rgba(255,255,255,.55);
  cursor:pointer;
}
.dot.active{background:white}

.section{padding:85px 0;background:white}
.section.light{background:var(--cream)}
.center{text-align:center;max-width:780px;margin:0 auto 42px}
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:42px;align-items:center}
.split p{color:var(--muted)}

.check-card{
  background:linear-gradient(135deg,var(--green),#0c2d20);
  color:white;
  padding:38px;
  border-radius:30px;
  box-shadow:var(--shadow);
}
.check-card h3{color:white}
.check-card ul{padding:0;margin:0;list-style:none}
.check-card li{padding:13px 0;border-bottom:1px solid rgba(255,255,255,.18)}
.check-card li:before{content:"✔ ";color:#a8f0c6;font-weight:bold}

.cards,.features,.uses{display:grid;gap:22px}
.cards{grid-template-columns:repeat(4,1fr)}

.card,.use-card,.features div{
  background:white;
  padding:28px;
  border-radius:26px;
  box-shadow:0 10px 30px rgba(0,0,0,.06);
}

.card p,.features p,.use-card p{color:var(--muted)}
.card a{color:var(--berry);font-weight:800;text-decoration:none}
.icon{font-size:2rem;display:inline-block;margin-bottom:12px}

.features{grid-template-columns:repeat(3,1fr)}
.why{background:linear-gradient(180deg,#fff,#f3f8f0)}

.uses{grid-template-columns:repeat(3,1fr)}
.use-img{
  height:210px;
  border-radius:22px;
  margin-bottom:20px;
  background-size:cover;
  background-position:center;
}

.blueberries{background-image:url('https://images.unsplash.com/photo-1498557850523-fd3d118b962e?auto=format&fit=crop&w=900&q=80')}
.raspberries{background-image:url('https://images.unsplash.com/photo-1577069861033-55d04cec4ef5?auto=format&fit=crop&w=900&q=80')}
.strawberries{
    background-image:url('https://images.unsplash.com/photo-1518635017498-87f514b751ba?auto=format&fit=crop&w=900&q=80');
}

.contact{background:linear-gradient(135deg,var(--green),#0b2b1e);color:white}
.contact h2,.contact .eyebrow{color:white}
.contact p{color:rgba(255,255,255,.82)}
.contact a{color:white}

.contact-box{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.contact-data{margin-top:25px}

form{
  background:white;
  padding:30px;
  border-radius:28px;
  box-shadow:var(--shadow);
}

input,textarea,select{
  width:100%;
  padding:15px 16px;
  margin-bottom:14px;
  border-radius:14px;
  border:1px solid #dce5dd;
  font:inherit;
  background:white;
}

textarea{resize:vertical}
form .btn{width:100%}

.whatsapp-float{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:80;
  background:#24c063;
  color:white;
  text-decoration:none;
  font-weight:900;
  padding:14px 20px;
  border-radius:999px;
  box-shadow:0 12px 28px rgba(0,0,0,.22);
}

footer{background:#071d15;color:white;padding:55px 0 20px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px}
footer a{display:block;color:rgba(255,255,255,.76);text-decoration:none;margin:8px 0}
footer p{color:rgba(255,255,255,.74)}
.copy{text-align:center;margin-top:35px;padding-top:20px;border-top:1px solid rgba(255,255,255,.12);color:rgba(255,255,255,.58)}

@media(max-width:900px){
  .menu-btn{display:block}

  nav{
    position:absolute;
    left:0;
    right:0;
    top:100%;
    background:white;
    flex-direction:column;
    align-items:flex-start;
    padding:20px 4%;
    box-shadow:0 20px 30px rgba(0,0,0,.08);
    display:none;
  }

  #menu-toggle:checked ~ nav{display:flex}

  .logo-img{
    height:70px;
    max-width:230px;
  }

  .hero-slider{
    height:72vh;
    min-height:500px;
  }

  h1{
    font-size:clamp(1.85rem,8vw,2.65rem);
  }

  .slide-content{
    padding:0 18px;
    max-width:92%;
  }

  .slider-btn{
    width:40px;
    height:40px;
    font-size:28px;
  }

  .prev{left:10px}
  .next{right:10px}

  .whatsapp-float{
    right:14px;
    bottom:14px;
    padding:12px 16px;
    font-size:.92rem;
  }

  .split,.contact-box{grid-template-columns:1fr}
  .cards,.features,.uses{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .section{padding:65px 0}
}
