html{
 scroll-behavior:smooth;
}

*{
 box-sizing:border-box;
}

body{
 margin:0;
 font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;
 background:linear-gradient(135deg,#fdf8f2,#a6c48a);
 color:#333;
 line-height:1.6;
 min-height:100vh;
}

/* ============================================
 UTILIDADES
 ============================================ */
.sr-only{
 position:absolute;
 width:1px;
 height:1px;
 padding:0;
 margin:-1px;
 overflow:hidden;
 clip:rect(0,0,0,0);
 white-space:nowrap;
 border-width:0;
}

/* ============================================
 BREADCRUMBS - VISIBLES ✅
 ============================================ */
.breadcrumbs{
 background-color:rgba(255,255,255,0.95);
 padding:0.8rem 1.5rem;
 max-width:1200px;
 margin:0 auto 1rem;
 font-size:0.9rem;
 color:#555;
 border-radius:8px;
 box-shadow:0 2px 4px rgba(0,0,0,0.08);
 display:flex;
 align-items:center;
 gap:0.5rem;
 flex-wrap:wrap;
}

.breadcrumbs a{
 color:#566c34;
 text-decoration:none;
 font-weight:500;
 transition:color 0.3s ease;
}

.breadcrumbs a:hover{
 color:#3e4e26;
 text-decoration:underline;
}

.breadcrumbs a:focus{
 outline:2px solid #566c34;
 outline-offset:2px;
 border-radius:4px;
}

.breadcrumbs span{
 color:#333;
 font-weight:600;
}

.breadcrumbs::before{
 content:"🏠";
 margin-right:0.3rem;
 font-size:1rem;
}

@media (max-width:768px){
 .breadcrumbs{
  font-size:0.85rem;
  padding:0.6rem 1rem;
 }
 .breadcrumbs::before{
  font-size:0.9rem;
 }
}

/* ============================================
 HEADER Y NAVEGACIÓN
 ============================================ */
.logo{
 max-width:200px !important;
 height:auto;
 display:block;
 margin:0 auto 1rem;
 transition:all 0.3s ease;
}

.slogan{
 font-size:1.1rem;
 font-style:italic;
 color:#020202;
 text-align:center;
 margin-top:-0.5rem;
 transition:all 0.3s ease;
}

header{
 background-color:rgba(86,108,52,0.85);
 padding:1rem;
 text-align:center;
 position:sticky;
 top:0;
 z-index:1000;
 box-shadow:0 2px 6px rgba(0,0,0,0.3);
 transition:all 0.3s ease;
}

header.scrolled{
 padding:0.5rem !important;
 background-color:rgba(86,108,52,0.95) !important;
}

header.scrolled .logo{
 max-width:120px !important;
 margin:0 auto 0.5rem !important;
}

header.scrolled .slogan{
 font-size:0.9rem !important;
 margin-top:-0.3rem !important;
}

header h1{
 margin:0;
 color:#f0e68c;
 text-shadow:2px 2px 4px rgba(0,0,0,0.7);
 font-size:1.8rem;
}

nav{
 background-color:#3e4e26;
 padding:0.5rem;
 transition:all 0.3s ease;
}

nav.scrolled{
 padding:0.3rem !important;
}

nav ul{
 display:flex;
 flex-wrap:wrap;
 justify-content:center;
 gap:1rem;
 list-style:none;
 margin:0;
 padding:0;
 transition:all 0.3s ease;
}

nav.scrolled ul{
 gap:0.5rem !important;
}

nav li{
 flex-shrink:0;
}

nav a{
 color:white;
 text-decoration:none;
 font-weight:bold;
 padding:0.5rem 1rem;
 border-radius:4px;
 transition:all 0.3s ease;
 display:block;
 font-size:0.9rem;
}

nav.scrolled a{
 font-size:0.8rem !important;
 padding:0.3rem 0.8rem !important;
}

nav a:hover{
 color:#ffd700;
 background-color:rgba(255,215,0,0.1);
}

/* ============================================
 HERO
 ============================================ */
.hero{
 position:relative;
 display:flex;
 align-items:center;
 justify-content:center;
 text-align:center;
 color:white;
 overflow:hidden;
 min-height:250px;
}

.hero img{
 position:absolute;
 top:0;
 left:0;
 width:100%;
 height:100%;
 object-fit:cover;
 filter:brightness(0.6);
 z-index:1;
}

.hero-texto{
 position:relative;
 z-index:2;
 padding:1.5rem;
 max-width:90%;
}

.hero-texto h1{
 font-size:1.6rem;
 margin-bottom:1rem;
 text-shadow:2px 2px 4px rgba(0,0,0,0.8);
}

.hero-texto p{
 font-size:1rem;
 margin-bottom:1.5rem;
 text-shadow:1px 1px 2px rgba(0,0,0,0.8);
}

.btn-principal{
 background-color:#566c34;
 color:white;
 padding:0.8rem 1.5rem;
 border-radius:30px;
 text-decoration:none;
 font-weight:bold;
 display:inline-block;
 transition:background-color 0.3s ease;
 font-size:0.9rem;
}

.btn-principal:hover{
 background-color:#3e4e26;
}

/* ============================================
 SECCIONES GENERALES
 ============================================ */
section{
 padding:1.5rem;
 max-width:1200px;
 margin:0 auto 2rem;
}

main{
 padding:1.5rem;
 max-width:1200px;
 margin:0 auto 2rem;
}

h2{
 text-align:center;
 color:#566c34;
 font-size:1.5rem;
 margin-bottom:1.5rem;
}

.historia p{
 text-align:justify;
 margin-bottom:1.2rem;
 font-size:0.95rem;
}

/* ============================================
 PÁGINA UBICACIÓN
 ============================================ */
.frase{
 text-align:center;
 font-style:italic;
 color:#666;
 margin-bottom:1.5rem;
 font-size:1rem;
}

.alerta,
.contador{
 text-align:center;
 padding:1rem;
 margin-bottom:1.5rem;
 border-radius:8px;
 font-weight:bold;
}

.alerta{
 background:#ffe8e8;
 color:#b30000;
 border-left:6px solid #ff4c4c;
}

.contador{
 background:#fff7d6;
 color:#b38700;
 border-left:6px solid #ffd700;
}

.contador p{
 margin:0;
 font-size:1rem;
}

.mercado{
 background:#ffffffcc;
 border-radius:12px;
 padding:1.5rem;
 margin-bottom:2rem;
 box-shadow:0 8px 20px rgba(0,0,0,0.1);
 transition:transform 0.3s ease;
}

.mercado:hover{
 transform:scale(1.02);
}

.mercado h3{
 margin-top:0;
 color:#344e26;
 font-size:1.3rem;
}

.contenedor{
 display:flex;
 flex-wrap:wrap;
 gap:1rem;
 justify-content:center;
 align-items:center;
 margin-top:1rem;
}

.contenedor img,
.contenedor iframe{
 width:100%;
 max-width:500px;
 border-radius:10px;
 box-shadow:0 4px 10px rgba(0,0,0,0.1);
 height:auto;
}

.contenedor iframe{
 min-height:250px;
}

.contenedor > p:first-of-type{
 text-align:center;
 margin:0 auto 2rem;
 max-width:800px;
 line-height:1.6;
 color:#555;
 font-size:1rem;
}

.btn-mapa{
 display:inline-block;
 margin-top:1rem;
 padding:0.6rem 1.2rem;
 background-color:#566c34;
 color:white;
 border-radius:30px;
 text-decoration:none;
 transition:background-color 0.3s ease;
 font-size:0.9rem;
}

.btn-mapa:hover{
 background-color:#3e4e26;
}

/* ============================================
 TESTIMONIOS
 ============================================ */
.testimonios{
 background:#f3f3f3;
 padding:2rem 1rem;
 border-radius:12px;
 text-align:center;
 margin-top:3rem;
 max-width:900px;
 margin-left:auto;
 margin-right:auto;
}

.testimonios h2{
 text-align:center;
 color:#566c34;
 font-size:1.5rem;
 margin-bottom:2rem;
}

.testimonio{
 display:flex;
 align-items:center;
 gap:1.5rem;
 margin-bottom:2rem;
 padding:1.5rem;
 background:white;
 border-radius:10px;
 box-shadow:0 2px 8px rgba(0,0,0,0.08);
 text-align:left;
 transition:transform 0.3s ease,box-shadow 0.3s ease;
}

.testimonio:hover{
 transform:translateY(-3px);
 box-shadow:0 4px 12px rgba(0,0,0,0.12);
}

.testimonio:last-child{
 margin-bottom:0;
}

.avatar{
 flex-shrink:0;
 width:60px;
 height:60px;
 border-radius:50%;
 display:flex;
 align-items:center;
 justify-content:center;
 font-size:1.5rem;
 font-weight:bold;
 color:white;
 box-shadow:0 3px 10px rgba(0,0,0,0.15);
}

.avatar.beatriz{
 background:linear-gradient(135deg,#a6c48a,#7a9d54);
}

.avatar.sergio{
 background:linear-gradient(135deg,#566c34,#3e4e26);
}

.avatar.laura{
 background:linear-gradient(135deg,#8b7355,#6b5444);
}

.testimonio-contenido{
 flex:1;
}

.testimonio-texto{
 font-style:italic;
 margin-bottom:0.8rem;
 font-size:0.95rem;
 color:#333;
 line-height:1.6;
}

.testimonio-autor{
 font-weight:600;
 color:#566c34;
 font-size:0.9rem;
}

.testimonio-ubicacion{
 color:#777;
 font-size:0.85rem;
}

/* ============================================
 CARRUSEL SWIPER
 ============================================ */
.mySwiper{
 margin:2rem auto !important;
 border-radius:12px;
 box-shadow:0 4px 12px rgba(0,0,0,0.2);
 width:100%;
 max-width:320px;
}

.mySwiper .swiper-slide{
 text-align:center;
 font-size:18px;
 background:#f3f3f3;
 display:flex;
 justify-content:center;
 align-items:center;
 border-radius:12px;
}

.mySwiper .swiper-slide img{
 width:100%;
 height:auto;
 object-fit:cover;
 display:block;
 border-radius:12px;
}

.swiper-button-next,
.swiper-button-prev{
 color:#566c34 !important;
 transition:color 0.3s ease;
}

.swiper-button-next:hover,
.swiper-button-prev:hover{
 color:#3e4e26 !important;
}

.swiper-pagination-bullet{
 background-color:#566c34;
}

.swiper-pagination-bullet-active{
 background-color:#3e4e26;
}

/* ============================================
 CATÁLOGO Y PRODUCTOS
 ============================================ */
.catalogo{
 display:grid;
 grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
 gap:1.5rem;
 margin-top:2rem;
}

.producto{
 background-color:#fff;
 border-radius:10px;
 padding:1rem;
 text-align:center;
 box-shadow:0 4px 10px rgba(0,0,0,0.1);
 transition:transform 0.3s ease;
 display:flex;
 flex-direction:column;
 align-items:center;
}

.producto:hover{
 transform:translateY(-5px);
}

.producto img{
 width:100%;
 max-width:250px;
 height:200px;
 object-fit:cover;
 border-radius:8px;
 margin-bottom:0.8rem;
}

.producto h3{
 margin:0.8rem 0 0.5rem;
 color:#344e26;
 font-size:1.1rem;
}

.producto p{
 margin:0;
 font-size:0.95rem;
 text-align:justify;
}

.btn-comprar{
 display:inline-block;
 margin-top:2rem;
 padding:0.8rem 1.5rem;
 background-color:#566c34;
 color:white;
 border-radius:30px;
 text-decoration:none;
 font-weight:bold;
 transition:background-color 0.3s ease;
 font-size:0.9rem;
}

.btn-comprar:hover{
 background-color:#3e4e26;
}

.galeria-productos{
 display:grid;
 grid-template-columns:repeat(3,1fr);
 gap:1.5rem;
 margin-top:2rem;
}

.galeria-productos .producto{
 background-color:#fff;
 border-radius:10px;
 padding:1rem;
 text-align:center;
 box-shadow:0 4px 10px rgba(0,0,0,0.1);
 transition:transform 0.3s ease;
 display:flex;
 flex-direction:column;
 align-items:center;
}

.galeria-productos .producto:hover{
 transform:translateY(-5px);
}

.galeria-productos .producto img{
 width:100%;
 max-width:100%;
 height:250px;
 object-fit:cover;
 border-radius:8px;
 margin-bottom:0.8rem;
}

.galeria-productos .producto h3{
 margin:0.8rem 0 0.5rem;
 color:#344e26;
 font-size:1.1rem;
}

@media (max-width:768px){
 .galeria-productos{
 grid-template-columns:1fr;
}
 
 .galeria-productos .producto img{
 height:200px;
}
}

@media (min-width:769px) and (max-width:1024px){
 .galeria-productos{
 grid-template-columns:repeat(2,1fr);
}
}

/* ============================================
 PÁGINA BLOG
 ============================================ */
#seccion-blog{
 text-align:center;
 margin-bottom:1rem;
}

.entrada{
 background:white;
 border-radius:12px;
 box-shadow:0 4px 12px rgba(0,0,0,0.1);
 margin-bottom:2rem;
 overflow:hidden;
 padding:1.5rem;
 transition:transform 0.3s ease;
}

.entrada:hover{
 transform:translateY(-5px);
}

.entrada h3{
 color:#3e4e26;
 font-size:1.3rem;
 margin-bottom:0.8rem;
}

.fecha{
 font-size:0.9rem;
 color:#777;
 display:block;
 margin-bottom:1rem;
 font-weight:500;
}

.entrada p{
 line-height:1.8;
 margin-bottom:1rem;
 font-size:0.95rem;
 color:#333;
}

.entrada ul{
 margin-top:0.5rem;
 margin-bottom:1.5rem;
 padding-left:1.2rem;
}

.entrada li{
 margin-bottom:0.5rem;
 list-style:disc;
}

.entrada ol{
 margin-top:0.5rem;
 margin-bottom:1.5rem;
 padding-left:1.2rem;
}

.entrada ol li{
 margin-bottom:0.8rem;
 list-style:decimal;
}

.entrada strong{
 color:#2d3721;
 font-weight:600;
}

.entrada em{
 color:#5a6b44;
 font-style:italic;
}

.entrada img{
 width:100%;
 max-width:700px;
 height:auto;
 min-height:300px;
 object-fit:cover;
 display:block;
 margin:1.5rem auto;
 border-radius:12px;
 box-shadow:0 6px 20px rgba(0,0,0,0.15);
 transition:transform 0.3s ease,box-shadow 0.3s ease;
}

.entrada img:hover{
 transform:scale(1.02);
 box-shadow:0 8px 25px rgba(0,0,0,0.2);
}

.contenido{
 padding:0;
}

.info-receta{
 display:flex;
 flex-wrap:wrap;
 gap:1rem;
 justify-content:center;
 margin:1rem 0;
 font-size:0.9rem;
 color:#666;
}

.info-receta span{
 background:#f5f5f5;
 padding:0.4rem 0.8rem;
 border-radius:20px;
}

.dificultad{
 font-weight:600;
}

.btn-receta{
 display:inline-block;
 margin-top:1rem;
 padding:0.6rem 1.2rem;
 background-color:#566c34;
 color:white;
 border-radius:30px;
 text-decoration:none;
 font-weight:bold;
 transition:background-color 0.3s ease;
 font-size:0.9rem;
}

.btn-receta:hover{
 background-color:#3e4e26;
}


.recetas-relacionadas{
 background:#f9f9f9;
 border-left:4px solid #566c34;
 padding:1.2rem 1.5rem;
 margin-top:2rem;
 border-radius:8px;
}

.recetas-relacionadas h4{
 margin:0 0 1rem 0;
 color:#3e4e26;
 font-size:1.1rem;
 font-weight:600;
}

.recetas-relacionadas ul{
 list-style:none;
 padding:0;
 margin:0;
}

.recetas-relacionadas li{
 margin-bottom:0.7rem;
}

.recetas-relacionadas li:last-child{
 margin-bottom:0;
}

.recetas-relacionadas a{
 color:#566c34;
 text-decoration:none;
 font-weight:500;
 display:inline-block;
 padding:0.3rem 0;
 transition:all 0.3s ease;
 position:relative;
}

.recetas-relacionadas a::before{
 content:"→ ";
 color:#8ca56e;
 font-weight:bold;
}

.recetas-relacionadas a:hover{
 color:#3e4e26;
 transform:translateX(5px);
}


.descripcion-blog{
 text-align:center;
 color:#666;
 font-size:1rem;
 margin-top:0 !important;
 margin-bottom:2.5rem !important;
 padding:0 1rem;
 line-height:1.6;
}


.contenedor-blog{
 display:block !important;
 flex-wrap:initial !important;
 gap:initial !important;
 justify-content:initial !important;
 align-items:initial !important;
}

.blog-header{
 text-align:center;
 margin-bottom:2rem;
}

.blog-header h2{
 margin-bottom:0.5rem;
}

.blog-header .descripcion-blog{
 margin-top:0.5rem;
 margin-bottom:0;
}


.share-buttons{
 display:flex;
 gap:0.8rem;
 align-items:center;
 margin-top:1.5rem;
 padding-top:1.5rem;
 border-top:1px solid #e0e0e0;
}

.share-label{
 font-size:0.9rem;
 color:#666;
 font-weight:500;
 margin-right:0.5rem;
}

.share-btn{
 display:inline-flex;
 align-items:center;
 justify-content:center;
 width:36px;
 height:36px;
 border-radius:50%;
 background-color:#f5f5f5;
 color:#666;
 text-decoration:none;
 transition:all 0.3s ease;
 border:1px solid #e0e0e0;
}

.share-btn:hover{
 transform:translateY(-2px);
 box-shadow:0 4px 8px rgba(0,0,0,0.15);
}

.share-btn svg{
 width:18px;
 height:18px;
 fill:currentColor;
}

.share-btn.whatsapp{
 background-color:#e8f5e9;
 color:#25d366;
 border-color:#25d366;
}

.share-btn.whatsapp:hover{
 background-color:#25d366;
 color:white;
}

.share-btn.facebook{
 background-color:#e3f2fd;
 color:#1877f2;
 border-color:#1877f2;
}

.share-btn.facebook:hover{
 background-color:#1877f2;
 color:white;
}

.share-btn.twitter{
 background-color:#e1f5fe;
 color:#1da1f2;
 border-color:#1da1f2;
}

.share-btn.twitter:hover{
 background-color:#1da1f2;
 color:white;
}

.share-btn.email{
 background-color:#fce4ec;
 color:#e91e63;
 border-color:#e91e63;
}

.share-btn.email:hover{
 background-color:#e91e63;
 color:white;
}

.share-btn.copy{
 background-color:#f3e5f5;
 color:#9c27b0;
 border-color:#9c27b0;
}

.share-btn.copy:hover{
 background-color:#9c27b0;
 color:white;
}

.share-btn.copy.copied{
 background-color:#4caf50;
 color:white;
 border-color:#4caf50;
}

/* ============================================
 CTA FINAL
 ============================================ */
.cta-final{
 background:#ffffffcc;
 border-radius:12px;
 padding:2rem 1rem;
 text-align:center;
 box-shadow:0 8px 20px rgba(0,0,0,0.1);
 margin:2rem auto;
}

.cta-final h2{
 margin-bottom:1rem;
}

.cta-final p{
 margin-bottom:1.5rem;
 font-size:0.95rem;
}

/* ============================================
 PÁGINA CONTACTO
 ============================================ */
.info-contacto{
 text-align:center;
 margin-bottom:2rem;
}

.info-contacto p{
 margin:0.5rem 0;
 font-size:0.95rem;
}

form{
 background:#fff;
 padding:1.5rem;
 border-radius:12px;
 box-shadow:0 4px 12px rgba(0,0,0,0.1);
 display:grid;
 gap:1rem;
}

label{
 font-weight:bold;
 margin-top:1rem;
 font-size:0.95rem;
 color:#344e26;
}

input,
textarea{
 width:100%;
 padding:0.7rem;
 border:1px solid #ccc;
 border-radius:6px;
 font-family:inherit;
 font-size:1rem;
}

textarea{
 resize:vertical;
 min-height:100px;
}

button{
 margin-top:1rem;
 padding:0.8rem 1.5rem;
 background-color:#566c34;
 color:white;
 border:none;
 border-radius:30px;
 font-size:0.9rem;
 font-weight:bold;
 cursor:pointer;
 transition:background-color 0.3s ease;
}

button:hover{
 background-color:#3e4e26;
}

#statusMessage{
 display:none;
 margin-top:1rem;
 font-weight:bold;
 color:#566c34;
 text-align:center;
}

/* ============================================
 PÁGINA GRACIAS
 ============================================ */
.gracias-contenedor{
 background:#fff;
 padding:3rem 2rem;
 border-radius:16px;
 box-shadow:0 6px 20px rgba(0,0,0,0.1);
 animation:fadeInUp 0.8s ease-out;
}

@keyframes fadeInUp{
 from{
 opacity:0;
 transform:translateY(30px);
}
 to{
 opacity:1;
 transform:translateY(0);
}
}

.emoji{
 font-size:4rem;
 margin-bottom:1rem;
}

.btn{
 display:inline-block;
 margin:0.5rem;
 padding:0.8rem 1.8rem;
 background-color:#566c34;
 color:white;
 text-decoration:none;
 border-radius:30px;
 font-weight:bold;
 transition:background-color 0.3s ease;
 font-size:1rem;
}

.btn:hover{
 background-color:#3e4e26;
}

.btn-outline{
 background-color:transparent;
 border:2px solid #566c34;
 color:#566c34;
}

.btn-outline:hover{
 background-color:#566c34;
 color:white;
}

/* ============================================
 FOOTER
 ============================================ */
footer{
 background:#3e4e26;
 color:white;
 text-align:center;
 padding:1.5rem 1rem;
 font-size:0.85rem;
}

footer p{
 margin-top:1rem;
 margin-bottom:0;
}

footer a{
 color:#d5fa05;
 text-decoration:none;
}

footer a:hover{
 text-decoration:underline;
}

/* ============================================
 BOTONES FLOTANTES
 ============================================ */
.whatsapp-btn{
 position:fixed;
 bottom:20px;
 right:20px;
 background-color:#25d366;
 color:white;
 width:60px;
 height:60px;
 border-radius:50%;
 text-decoration:none;
 font-weight:bold;
 z-index:999;
 box-shadow:0 4px 15px rgba(37,211,102,0.4);
 animation:fadeIn 0.5s ease-in-out;
 display:flex;
 align-items:center;
 justify-content:center;
 transition:all 0.3s ease;
}

.btn-subir{
 display:none;
 position:fixed;
 bottom:80px;
 right:20px;
 background-color:#566c34;
 color:white;
 padding:0.8rem 1rem;
 border-radius:30px;
 text-decoration:none;
 font-weight:bold;
 z-index:9999;
 box-shadow:0 4px 10px rgba(0,0,0,0.2);
 transition:opacity 0.3s ease;
 font-size:0.8rem;
}

.btn-subir:hover{
 background-color:#3e4e26;
}

@keyframes fadeIn{
 from{
 opacity:0;
 transform:translateY(20px);
}
 to{
 opacity:1;
 transform:translateY(0);
}
}

/* ============================================
 MEDIA QUERIES
 ============================================ */


@media (max-width:480px){
 .logo{
 max-width:150px !important;
}

 .slogan{
 font-size:1rem;
}

 header h1{
 font-size:1.5rem;
}

 nav ul{
 gap:0.5rem;
}

 nav a{
 font-size:0.8rem;
 padding:0.4rem 0.8rem;
}

 .hero{
 min-height:200px;
}

 .hero-texto h1{
 font-size:1.3rem;
}

 .hero-texto p{
 font-size:0.9rem;
}

 section,
 main{
 padding:1rem;
 margin-bottom:1.5rem;
}

 h2{
 font-size:1.3rem;
}

 .frase{
 font-size:1.2rem;
}

 .historia p{
 font-size:1rem;
}

 .mercado{
 padding:2rem;
}

 .mercado h3{
 font-size:1.5rem;
}

 .contenedor iframe{
 min-height:350px;
}

 .testimonio{
 flex-direction:column;
 text-align:center;
 gap:1rem;
 padding:1.2rem;
}

 .avatar{
 width:50px;
 height:50px;
 font-size:1.3rem;
}

 .testimonio-contenido{
 text-align:center;
}

 .testimonio-texto{
 font-size:0.9rem;
}

 .cta-final{
 padding:3rem 1rem;
}

 form{
 padding:2rem;
}

 button{
 font-size:1rem;
}

 .whatsapp-btn{
 display:none;
}

 .mySwiper{
 max-width:600px;
}

 .mySwiper .swiper-slide img{
 height:auto;
}

 .entrada{
 padding:2rem;
}

 .entrada h3{
 font-size:1.5rem;
}

 .entrada p{
 font-size:1rem;
}

 .entrada img{
 min-height:400px;
}

 .share-buttons{
 flex-wrap:wrap;
 justify-content:center;
}

 .share-label{
 width:100%;
 text-align:center;
 margin-bottom:0.5rem;
}
}


@media (max-width:768px){
 header.scrolled{
 padding:0.8rem !important;
}

 header.scrolled .logo{
 max-width:100px !important;
}

 nav.scrolled a{
 font-size:0.8rem !important;
 padding:0.3rem 0.6rem !important;
}

 .hero{
 min-height:200px;
}

 .hero-texto{
 padding:1rem;
}

 .hero-texto h1{
 font-size:1.4rem;
 margin-bottom:0.8rem;
}

 .hero-texto p{
 font-size:0.9rem;
 margin-bottom:1rem;
}

 .btn-principal{
 padding:0.6rem 1.2rem;
 font-size:0.8rem;
}

 section,
 main{
 padding:1rem;
 margin-bottom:1.5rem;
}

 h2{
 font-size:1.4rem;
 margin-bottom:1rem;
}

 .historia p{
 font-size:0.9rem;
}

 .frase{
 font-size:0.9rem;
}

 .mercado{
 padding:1rem;
}

 .mercado h3{
 font-size:1.2rem;
}

 .contenedor{
 gap:0.5rem;
}

 .contenedor iframe{
 min-height:200px;
}

 .contenedor > p:first-of-type{
 font-size:0.9rem;
 padding:0 1rem;
}

 .testimonios{
 padding:1.5rem 1rem;
}

 .testimonio{
 font-size:0.9rem;
}

 .galeria-productos .producto img{
 height:auto;
}

 .cta-final{
 padding:1.5rem 1rem;
}

 form{
 padding:1rem;
}

 button{
 font-size:0.85rem;
 padding:0.7rem 1.2rem;
}
 
 .gracias-contenedor{
 padding:2rem 1rem;
}

 .gracias-contenedor h2{
 font-size:1.5rem;
}

 .btn{
 display:block;
 margin:0.5rem auto;
 width:80%;
 max-width:300px;
}

 .whatsapp-btn{
 bottom:15px;
 right:15px;
 width:50px;
 height:50px;
}

 .whatsapp-btn svg{
 width:24px;
 height:24px;
}

 .btn-subir{
 bottom:65px;
 right:15px;
 padding:0.6rem 0.8rem;
}

 .swiper-button-next,
 .swiper-button-prev{
 display:none;
}

 .mySwiper{
 max-width:280px;
}

 .mySwiper .swiper-slide img{
 height:auto;
}
}


@media (min-width:481px) and (max-width:768px){
 .hero{
 min-height:300px;
}

 .hero-texto h1{
 font-size:1.8rem;
}

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

 .mySwiper{
 max-width:400px;
}

 .mySwiper .swiper-slide img{
 height:auto;
}

 .contenedor iframe{
 min-height:250px;
}

 .contenedor > p:first-of-type{
 font-size:0.95rem;
}

 main{
 max-width:700px;
}
 
 .entrada img{
 min-height:250px;
}
}


@media (min-width:769px) and (max-width:1024px){
 header{
 padding:1.2rem;
}

 header.scrolled .logo{
 max-width:100px !important;
}

 header.scrolled .slogan{
 font-size:0.85rem !important;
}

 nav a{
 padding:0.4rem 0.8rem;
}

 .hero{
 min-height:400px;
}

 .hero-texto h1{
 font-size:2.2rem;
}

 section,
 main{
 padding:1.5rem;
 margin-bottom:2.5rem;
}

 h2{
 font-size:1.6rem;
}

 .mercado{
 padding:1.2rem;
}

 .mercado h3{
 font-size:1.4rem;
}
 
 .galeria-productos{
 grid-template-columns:repeat(3,1fr);
}

 .mySwiper{
 max-width:500px;
}

 .mySwiper .swiper-slide img{
 height:auto;
}

 .contenedor iframe{
 min-height:300px;
}

 .entrada img{
 min-height:350px;
}
}


@media (min-width:1025px){
 header{
 padding:1.5rem;
}

 header h1{
 font-size:2.2rem;
}

 nav{
 padding:1rem;
}

 nav ul{
 gap:2rem;
}

 nav a{
 font-size:1rem;
 padding:0.5rem 1rem;
}

 .hero{
 min-height:500px;
}

 .hero-texto h1{
 font-size:2.8rem;
}

 .hero-texto p{
 font-size:1.1rem;
}

 section,
 main{
 padding:2rem;
 margin-bottom:4rem;
}

 h2{
 font-size:1.8rem;
}

 .frase{
 font-size:1.2rem;
}

 .historia p{
 font-size:1rem;
}

 .mercado{
 padding:2rem;
}

 .mercado h3{
 font-size:1.5rem;
}

 .contenedor iframe{
 min-height:350px;
}

 .testimonios{
 padding:3rem 1rem;
}

 .testimonio{
 font-size:1.1rem;
}

 .cta-final{
 padding:3rem 1rem;
}

 form{
 padding:2rem;
}

 button{
 font-size:1rem;
}

 .whatsapp-btn{
 display:none;
}

 .mySwiper{
 max-width:600px;
}

 .mySwiper .swiper-slide img{
 height:auto;
}

 .entrada{
 padding:2rem;
}

 .entrada h3{
 font-size:1.5rem;
}

 .entrada p{
 font-size:1rem;
}

 .entrada img{
 min-height:400px;
}
}


@media (min-width:1200px){
 .mySwiper{
 max-width:700px;
}

 .mySwiper .swiper-slide img{
 height:auto;
}
}
/* ============================================
 BANNER DE COOKIES - Estilos
 Añadir al final de estilos.css
 ============================================ */


#cookie-overlay{
 display:none;
 position:fixed;
 top:0;
 left:0;
 width:100%;
 height:100%;
 background-color:rgba(0,0,0,0.5);
 z-index:9998;
 animation:fadeIn 0.3s ease;
}


#cookie-banner{
 display:none;
 position:fixed;
 bottom:0;
 left:0;
 right:0;
 background:white;
 padding:1.5rem;
 box-shadow:0 -4px 20px rgba(0,0,0,0.2);
 z-index:9999;
 animation:slideUp 0.4s ease;
 max-height:90vh;
 overflow-y:auto;
}

#cookie-banner.show,
#cookie-overlay.show{
 display:block;
}


.cookie-content{
 max-width:1000px;
 margin:0 auto;
}


.cookie-icon{
 font-size:2rem;
 margin-bottom:0.5rem;
}


.cookie-title{
 color:#566c34;
 font-size:1.3rem;
 font-weight:600;
 margin:0 0 0.8rem 0;
}


.cookie-text{
 color:#333;
 font-size:0.95rem;
 line-height:1.6;
 margin-bottom:1rem;
}


.cookie-text a{
 color:#566c34;
 text-decoration:underline;
 font-weight:500;
}

.cookie-text a:hover{
 color:#3e4e26;
}


.cookie-buttons{
 display:flex;
 gap:1rem;
 flex-wrap:wrap;
 justify-content:center;
 margin-top:1.5rem;
}


.cookie-btn{
 padding:0.8rem 1.5rem;
 border:2px solid #566c34;
 border-radius:8px;
 font-size:0.95rem;
 font-weight:600;
 cursor:pointer;
 transition:all 0.3s ease;
 flex:1;
 min-width:140px;
 max-width:200px;
}

.cookie-btn:hover{
 transform:translateY(-2px);
 box-shadow:0 4px 12px rgba(86,108,52,0.3);
}

.cookie-btn:active{
 transform:translateY(0);
}


.cookie-btn-accept{
 background-color:#566c34;
 color:white;
}

.cookie-btn-accept:hover{
 background-color:#3e4e26;
}


.cookie-btn-reject{
 background-color:white;
 color:#566c34;
}

.cookie-btn-reject:hover{
 background-color:#f0f4ec;
}


.cookie-btn-config{
 background-color:transparent;
 color:#566c34;
 border:2px solid #a6c48a;
}

.cookie-btn-config:hover{
 background-color:#f0f4ec;
 border-color:#566c34;
}


.cookie-config-panel{
 display:none;
 margin-top:1.5rem;
 padding-top:1.5rem;
 border-top:2px solid #e0e0e0;
}

.cookie-config-panel.show{
 display:block;
 animation:fadeIn 0.3s ease;
}


.cookie-option{
 background:#f9f9f9;
 border-radius:8px;
 padding:1rem;
 margin-bottom:1rem;
 border:1px solid #e0e0e0;
}

.cookie-option-header{
 display:flex;
 justify-content:space-between;
 align-items:center;
 margin-bottom:0.5rem;
}

.cookie-option-title{
 color:#566c34;
 font-size:1rem;
 font-weight:600;
 margin:0;
 display:flex;
 align-items:center;
 gap:0.5rem;
}

.cookie-badge{
 display:inline-block;
 padding:0.2rem 0.6rem;
 border-radius:12px;
 font-size:0.7rem;
 font-weight:600;
 text-transform:uppercase;
}

.cookie-badge-required{
 background-color:#e8f5e9;
 color:#2e7d32;
}

.cookie-badge-optional{
 background-color:#fff3e0;
 color:#e65100;
}

.cookie-option-description{
 color:#666;
 font-size:0.85rem;
 line-height:1.5;
 margin:0.5rem 0 0 0;
}


.cookie-toggle{
 position:relative;
 display:inline-block;
 width:50px;
 height:26px;
}

.cookie-toggle input{
 opacity:0;
 width:0;
 height:0;
}

.cookie-toggle-slider{
 position:absolute;
 cursor:pointer;
 top:0;
 left:0;
 right:0;
 bottom:0;
 background-color:#ccc;
 transition:0.3s;
 border-radius:26px;
}

.cookie-toggle-slider:before{
 position:absolute;
 content:"";
 height:20px;
 width:20px;
 left:3px;
 bottom:3px;
 background-color:white;
 transition:0.3s;
 border-radius:50%;
}

.cookie-toggle input:checked + .cookie-toggle-slider{
 background-color:#566c34;
}

.cookie-toggle input:checked + .cookie-toggle-slider:before{
 transform:translateX(24px);
}

.cookie-toggle input:disabled + .cookie-toggle-slider{
 opacity:0.5;
 cursor:not-allowed;
}


.cookie-config-buttons{
 display:flex;
 gap:1rem;
 justify-content:center;
 margin-top:1.5rem;
 flex-wrap:wrap;
}


@keyframes fadeIn{
 from{
 opacity:0;
}
 to{
 opacity:1;
}
}

@keyframes slideUp{
 from{
 transform:translateY(100%);
}
 to{
 transform:translateY(0);
}
}


@media (max-width:768px){
 #cookie-banner{
 padding:1rem;
}
 
 .cookie-title{
 font-size:1.1rem;
}
 
 .cookie-text{
 font-size:0.9rem;
}
 
 .cookie-buttons{
 flex-direction:column;
}
 
 .cookie-btn{
 max-width:100%;
}
 
 .cookie-option-header{
 flex-direction:column;
 align-items:flex-start;
 gap:0.8rem;
}
/* Clase para ocultar elementos con filtros */
.oculto {
  display: none !important;
}
}