@font-face {
font-family:'EB Garamond', serif;
src: url("template/estandar/fonts/EBGaramond-Regular.ttf");
}

.bg-trans{background-color:#25a48270}
.font-bodoni{font-family: 'bodoni'}
.font-garamond {font-family:'EB Garamond', serif;}

*{font-family: 'EB Garamond', serif;}
.border-t-1{border-top-width: 1px;}
.bg-footer-gray{background-color: #f3f3f3;}
p{font-weight: 300;font-size: 18px}
.bg-gray-menu{background-color: #f2f2f6;}
.h-1px{height: 1px}
.img::after{content: "";display: block;padding-top: 80%;}
.img-pequena{height: calc(50% + 2.5rem);}
.p-5\/10::after{content:"";display:block;padding-top:50%;}
.p-6\/10::after{content:"";display:block;padding-top:60%;}
.p-7\/10::after{content:"";display:block;padding-top:70%;}
.modal {
  transition: opacity 0.25s ease;
}
body.modal-active {
  overflow-x: hidden;
  overflow-y: visible !important;
}
/* img */
.img{position: relative; overflow: hidden;}
.img::after{content: ""; display: block; padding-top: 60%;}
.img>img[data-src]{opacity: 0;}

/* Navbar */
nav li.active{border-bottom:1px solid #a2c7b6}
.text-colorEmpresa{color: #e20b1e;}
.bg-red{background-color: #e20b1e}
/* Banner */
.tns-nav{z-index: 10!important;position: absolute;bottom:15px;left: 50%;transform: translateX(-50%);z-index:9999}
.tns-nav-active{background-color:#e10b1e!important;}
.tns-nav button {border-radius: 9999px;width: 12px;height: 12px;margin-left: 20px;background-color: #FFF;}
/* Productos */
.controls-producto{top:50%;transform: translateY(-50%);}
/* Categorias */
.transition{transition: all 0.4s;}
.transition2s{transition: all 0.2s;}
/* cesta */
.producto-cesta>div>div {
    width: 50%;
    padding: 0 15px;
}
.producto-cesta>div:not(.img) {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.quantity-selector span {
    padding-left: 15px;
    padding-right: 15px;
}
.producto-cesta>div>p {
    width: 25%;
    text-align: right;
}

.producto-cesta p {
    font-size: 14px;
    margin-top: 10px;
}
.tns-liveregion{display:none;}
.min-h-50{
    min-height: 25rem;
}
.h-banner{height:100vh;max-height:700px;}

/* Ajustes generales para evitar desbordes */
html, body {
    overflow-x: hidden;
    width: 100%;
}

/* RESPONSIVE */
@media screen and (max-width: 1023px) {
    .container {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
    .lg\:w-1\/2 {
        width: 100%; /* Apila secciones en tablets */
    }
    .max-w-md {
        max-width: 80%; /* Ajusta imágenes en tablets */
    }
}

@media screen and (min-width: 640px) {
    /* Mantener estilos existentes o añadir ajustes si es necesario */
}

@media screen and (max-width: 639px) {
    .container {
        padding-left: 1rem;
        padding-right: 1rem;
    }
    .flex-wrap {
        flex-direction: column;
        align-items: center;
    }
    .text-center {
        text-align: center !important;
    }
    img.object-cover {
        width: 100%;
        height: auto;
    }
    .navbar {
        max-height: 80vh; /* Evita desborde del menú móvil */
    }
    .font-garamond {
        font-size: 16px; /* Reduce tamaño de fuente en móviles */
    }
    .text-3xl {
        font-size: 1.75rem; /* Ajusta títulos grandes en móviles */
    }
    .text-xl {
        font-size: 1.25rem; /* Ajusta subtítulos en móviles */
    }
    .max-w-md {
        max-width: 90%; /* Limita el ancho de imágenes en móviles */
    }
    .h-banner {
        height: 60vh; /* Reduce altura del banner en móviles */
        max-height: 500px;
    }
    .banner h1 {
        font-size: 1.75rem; /* Ajusta tamaño del título */
    }
    .banner h2 {
        font-size: 1.25rem; /* Ajusta tamaño del subtítulo */
    }
    .navbar ul li {
        text-align: center;
        padding: 0.5rem 0;
    }
    .navbar a {
        font-size: 1rem; /* Reduce tamaño de fuente del menú */
    }
}

@media screen and (max-width: 991px) {
    /* Añadir ajustes adicionales si es necesario */
}

@media screen and (max-width: 767px) {
    /* Añadir ajustes adicionales si es necesario */
}

@media screen and (max-width: 500px) {
    /* Añadir ajustes adicionales para pantallas muy pequeñas si es necesario */
}