/* ==========================================================
   El Molino — ajustes responsivos sobre el export de Divi
   ========================================================== */

/* Evita cualquier scroll horizontal accidental en móviles */
html, body { overflow-x: clip; }
img, iframe, video { max-width: 100%; }

/* Franja de azulejos: estaba desplazada 6.7px a la izquierda y dejaba un hueco a la derecha */
.et_pb_image_1 { transform: translateY(-60.3px) !important; }

/* Hero "Bienvenidos": en pantallas angostas el background "cover" recortaba logo y letrero.
   Se fija la proporción real de la imagen (1366x768) para que siempre se vea completa. */
@media only screen and (max-width: 1100px) {
  .et_pb_section_0 {
    aspect-ratio: 1366 / 768;
    padding: 0 !important;
    min-height: 0 !important;
    background-size: cover !important;
    background-position: center center !important;
  }
  .et_pb_section_0 .et_pb_row_0 { display: none !important; }
}

/* Mojarra (PNG vertical con mucho espacio en blanco): en tablet y móvil se recorta el blanco sobrante */
@media only screen and (max-width: 980px) {
  .et_pb_image_2 { max-width: 560px; margin-left: auto !important; margin-right: auto !important; }
  .et_pb_image_2 .et_pb_image_wrap img {
    width: 100%;
    aspect-ratio: 16 / 11;
    object-fit: cover;
  }
}

/* Panel lateral cerrado: su sombra asomaba por el borde derecho */
.tab-content:not(.open) { box-shadow: none; visibility: hidden; transition: right .3s ease-in-out, visibility 0s .3s; }
.tab-content.open { visibility: visible; transition: right .3s ease-in-out; }

/* Botón flotante "MAIN MENU": más compacto en teléfonos para no tapar contenido */
@media only screen and (max-width: 480px) {
  .sliding-tab .tab-button { transform: scale(.85); transform-origin: bottom right; }
}

/* ==========================================================
   Submenú "Menú" con anclas a las categorías (menu.html)
   ========================================================== */
#top-menu li.molino-dd { position: relative; }

#top-menu li.molino-dd > a::after { content: "" !important; font-size: 0 !important; display: inline-block; position: static !important; width: 6px; height: 6px; margin: 0 0 0 9px; vertical-align: 4px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .25s; }
#top-menu li.molino-dd:hover > a::after { transform: rotate(-135deg); vertical-align: 0; }
#top-menu .molino-sub { position: absolute; top: 100%; left: 50%; z-index: 9999; width: 290px; margin: 0; padding: 14px 0; list-style: none; background: #1600a3; border-top: 3px solid #fff; border-radius: 0 0 14px 14px; box-shadow: 0 18px 40px rgba(10, 0, 70, .35); opacity: 0; visibility: hidden; transform: translate(-50%, 8px); transition: opacity .2s, transform .2s, visibility 0s .2s; }
#top-menu li.molino-dd:hover > .molino-sub, #top-menu li.molino-dd:focus-within > .molino-sub { opacity: 1; visibility: visible; transform: translate(-50%, 0); transition: opacity .2s, transform .2s; }
#top-menu .molino-sub li { display: block; padding: 0; width: 100%; }
#top-menu .molino-sub a { display: block; width: 100%; padding: 10px 26px !important; color: #fff !important; font: 600 16px/1.25 'Poppins', Arial, sans-serif; text-align: left; opacity: 1 !important; transition: background .2s, color .2s, padding .2s; }
#top-menu .molino-sub a small { display: block; margin-top: 2px; font: italic 500 12.5px/1.2 'Playfair Display', Georgia, serif; color: rgba(255, 255, 255, .65); }
#top-menu .molino-sub a:hover, #top-menu .molino-sub a:focus-visible { background: rgba(255, 255, 255, .08); color: #ffce29 !important; padding-left: 32px !important; }

/* Menú móvil de Divi: el submenú aparece como lista anidada */
.et_mobile_menu .molino-sub { padding: 4px 0 8px 14px !important; border-left: 3px solid #ffce29; margin: 0 0 6px 6px !important; }
.et_mobile_menu .molino-sub a { font-size: 14px; padding: 8px 5% !important; }
.et_mobile_menu .molino-sub a small { display: block; font-style: italic; font-size: 12px; opacity: .7; }

/* ==========================================================
   Cuerpo de texto unificado en todo el sitio
   (referencia: "Tortilla hecha tradición" -> Inter 16px / 1.8)
   ========================================================== */
#page-container .et_pb_text:not(.et_pb_text_4) .et_pb_text_inner p,
#page-container .et_pb_text:not(.et_pb_text_4) .et_pb_text_inner p span,
#page-container .et_pb_text:not(.et_pb_text_4) .et_pb_text_inner p i,
#page-container .et_pb_blurb_description,
#page-container .et_pb_blurb_description p,
#page-container .et_pb_toggle_content,
#page-container .et_pb_toggle_content p {
  font-family: 'Inter', Helvetica, Arial, sans-serif !important;
  font-size: 16px !important;
  line-height: 1.8em !important;
  font-style: normal !important;
}
@media only screen and (max-width: 980px) {
  #page-container .et_pb_text:not(.et_pb_text_4) .et_pb_text_inner p,
  #page-container .et_pb_text:not(.et_pb_text_4) .et_pb_text_inner p span,
  #page-container .et_pb_text:not(.et_pb_text_4) .et_pb_text_inner p i,
  #page-container .et_pb_blurb_description, #page-container .et_pb_blurb_description p,
  #page-container .et_pb_toggle_content, #page-container .et_pb_toggle_content p { font-size: 15px !important; }
}
@media only screen and (max-width: 767px) {
  #page-container .et_pb_text:not(.et_pb_text_4) .et_pb_text_inner p,
  #page-container .et_pb_text:not(.et_pb_text_4) .et_pb_text_inner p span,
  #page-container .et_pb_text:not(.et_pb_text_4) .et_pb_text_inner p i,
  #page-container .et_pb_blurb_description, #page-container .et_pb_blurb_description p,
  #page-container .et_pb_toggle_content, #page-container .et_pb_toggle_content p { font-size: 14px !important; }
}
