/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 1.0.1
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/*
    Add your custom styles here
*/

/* Formato imagen destacada */

/* Proporción fija 532×600 (≈133:150) para el widget de imagen con clase `imagen-destacada` en Elementor */
.imagen-destacada .elementor-widget-container{
  aspect-ratio: 532 / 600;
  width: 100%;
  overflow: hidden;
}

/* Asegura que el enlace/figura/imagen llenen la caja */
.imagen-destacada .elementor-widget-container > a,
.imagen-destacada .elementor-widget-container > figure,
.imagen-destacada .elementor-widget-container > .elementor-image,
.imagen-destacada .elementor-widget-container > img{
  display: block;
  width: 100%;
  height: 100%;
}

.imagen-destacada img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover; /* recorta para mantener la proporción */
}

/* Fallback para navegadores sin `aspect-ratio` */
@supports not (aspect-ratio: 1 / 1) {
  .imagen-destacada .elementor-widget-container{
    position: relative;
    overflow: hidden;
  }
  .imagen-destacada .elementor-widget-container::before{
    content: "";
    display: block;
    padding-top: calc(600 / 532 * 100%); /* ≈ 112.78% */
  }
  .imagen-destacada .elementor-widget-container > a,
  .imagen-destacada .elementor-widget-container > figure,
  .imagen-destacada .elementor-widget-container > .elementor-image,
  .imagen-destacada .elementor-widget-container > img{
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
  }
  .imagen-destacada img{
    object-fit: cover;
  }
}

/* Estilo formulario */

/* === FORMULARIO NEWSLETTER (Elementor) === */
/* Contenedor: mantén flex y añade separación si quieres */
.formulario-newsletter .elementor-form .elementor-form-fields-wrapper{
  gap: 12px; /* ajusta a tu gusto */
}

/* Email: primera posición, ocupa el espacio disponible */
.formulario-newsletter .elementor-form .elementor-field-group.elementor-field-type-email{
  order: 1;
  flex: 1 1 60%;
  min-width: 260px;
}

/* Botón: segunda posición, a la derecha del email */
.formulario-newsletter .elementor-form .elementor-field-group.elementor-field-type-submit{
  order: 2;
  flex: 0 0 auto;
  width: auto;
  align-self: stretch;
  display: flex; /* permite que el botón ocupe toda la altura del campo */
}

/* Botón a igual altura que el input */
.formulario-newsletter .elementor-form .elementor-field-group.elementor-field-type-submit .elementor-button{
  height: 100%;
}

/* Aceptación: última posición y en línea completa debajo */
.formulario-newsletter .elementor-form .elementor-field-group.elementor-field-type-acceptance{
  order: 99;
  flex: 1 1 100%;
}

/* Quitar padding izquierdo del campo email */
.formulario-newsletter .elementor-form input[type="email"]{
  padding-left: 0 !important;
}

/* (Opcional) En móviles, apilar email y botón */
@media (max-width: 767px){
  .formulario-newsletter .elementor-form .elementor-field-group.elementor-field-type-email,
  .formulario-newsletter .elementor-form .elementor-field-group.elementor-field-type-submit{
    flex: 1 1 100%;
  }
}


/* Estilo texto destacado */

span.texto-destacado {
    color: #BF4111;
    font-style: italic;
    text-transform: none;
    font-size: clamp(3.75rem, 3.033rem + 2.681vw, 6.25rem);
}

span.texto-destacado-color {
    color: #BF4111;
    font-style: italic;
}

span.texto-destacado-2 {
    color: #BF4111;
    font-style: italic;
    text-transform: none;
    font-size: clamp(3.75rem, 3.033rem + 2.681vw, 6.25rem);
    margin-left: -10%;
}

/* Estilo general (ya lo tienes) */
.texto-destacado-2{
  display: inline-block;
  color: #BF4111;
  font-style: italic;
  text-transform: none;
  font-size: clamp(3.75rem, 3.033rem + 2.681vw, 6.25rem);
  margin-left: -10%;
  line-height: 1;
  transform: translateY(0.25em);
}

/* Ajustes solo para portátiles (pantallas ≤1366px) */
@media (max-width: 1608px){
  .texto-destacado-2{
    margin-left: 0 !important;            /* se acerca más a “PASIÓN” */
    transform: translateY(0.05em);  /* baja menos */
    font-size: clamp(3.2rem, 2.8rem + 1.8vw, 5rem); /* opcional: un poco más compacto */
  }
}


/* Divisor listing grid */

/* JetEngine Listing Grid — divisor entre ítems */
.listado-con-divisor .jet-listing-grid__item{
  position: relative;
  padding: 18px 0;                 /* espacio arriba/abajo; ajusta */
}

.listado-con-divisor .jet-listing-grid__item:not(:last-child)::after{
  content: "";
  position: absolute;
  left: 0;                         /* cambia a un valor >0 si quieres sangría */
  right: 0;
  bottom: 0;
  height: 1px;
  background: rgba(112, 112, 112, 0.26); /* #707070 con 26% de opacidad */
  /* equivalente en hex con alfa: background: #70707042; */
}


/* Estilo texto "especial" como encargar vajilla */

span.texto-destacado-3 {
    display: block;
    color: #BF4111;
    font-style: italic;
    text-transform: none;
    font-size: clamp(3.75rem, 3.033rem + 2.681vw, 6.25rem);
    margin-left: 20%;
    margin-top: -5%; /* ahora sí aplicará */
}

/* GALERÍA CUADRADA */

/* Forzar imágenes cuadradas en el carrusel */
.galeria-cuadrada .swiper-slide-inner {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1; /* Fuerza contenedor cuadrado */
  overflow: hidden;
}

.galeria-cuadrada .swiper-slide-inner img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover; /* Recorta la imagen para mantener el formato */
  object-position: center;
}
