/* ============================================================================
 * OYRSA — Adaptación móvil del contenido existente
 * ============================================================================
 * Objetivo: que la web actual se navegue bien en móvil mientras se construye
 * el contenido específico en el builder de Enfold.
 *
 * Todo este archivo aplica ÚNICAMENTE por debajo de 990px (breakpoint Enfold).
 * Se puede desactivar (temporalmente) comentando el enqueue en functions.php.
 * ============================================================================ */

@media (max-width: 989px) {

    /* ------------------------------------------------------------------
     * 0. Salvaguardas globales — evita scroll horizontal por desbordes
     * ------------------------------------------------------------------ */
    html, body { overflow-x: hidden !important; }
    #wrap_all, .container_wrap, #main { overflow-x: hidden; }

    img { max-width: 100% !important; height: auto !important; }

    /* ------------------------------------------------------------------
     * 1. Tipografía móvil (legible sin zoom)
     * ------------------------------------------------------------------ */
    body { font-size: 15px !important; line-height: 1.6 !important; }

    h1, .page-title, .entry-title { font-size: 28px !important; line-height: 1.2 !important; }
    h2 { font-size: 22px !important; line-height: 1.25 !important; }
    h3 { font-size: 18px !important; line-height: 1.3 !important; }
    h4 { font-size: 16px !important; line-height: 1.35 !important; }
    p  { font-size: 15px !important; margin-bottom: 12px !important; }

    /* Special headings de Enfold: respeta el tamaño declarado en el builder
       pero pone un cap razonable para que no rompan la pantalla */
    .av-special-heading .av-special-heading-tag,
    .avia-title-heading {
        font-size: clamp(22px, 6vw, 34px) !important;
        line-height: 1.2 !important;
    }
    .av-subheading_above, .av-subheading_below {
        font-size: 13px !important;
    }

    /* ------------------------------------------------------------------
     * 2. Secciones: padding vertical razonable
     * ------------------------------------------------------------------ */
    .avia-section,
    .av-layout-section,
    .container_wrap.main_color,
    .av-section-padded {
        padding-top: 40px !important;
        padding-bottom: 40px !important;
    }

    .av-minimum-height-100,
    .av-minimum-height-75,
    .av-minimum-height-50 {
        min-height: auto !important;
    }

    .container { padding-left: 18px !important; padding-right: 18px !important; }

    /* ------------------------------------------------------------------
     * 3. Columnas: apilado 100% (Enfold y cualquier combinación)
     * ------------------------------------------------------------------ */
    .flex_column,
    .flex_column.av_one_full,
    .flex_column.av_one_half,
    .flex_column.av_one_third,
    .flex_column.av_two_third,
    .flex_column.av_one_fourth,
    .flex_column.av_three_fourth,
    .flex_column.av_one_fifth,
    .flex_column.av_two_fifth,
    .flex_column.av_three_fifth,
    .flex_column.av_four_fifth,
    .flex_column.av_one_sixth,
    .flex_column.av_five_sixth,
    .av_one_half, .av_one_third, .av_one_fourth,
    .av_two_third, .av_three_fourth,
    .av_one_fifth, .av_two_fifth, .av_three_fifth, .av_four_fifth,
    .av_one_sixth, .av_five_sixth {
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        margin-bottom: 18px !important;
        clear: both !important;
        float: none !important;
    }

    .flex_column_table, .flex_column_table_cell {
        display: block !important;
        width: 100% !important;
    }

    /* Grids modernos de Enfold */
    .av-layout-grid-container,
    .av-layout-grid,
    .av-cell-col-1, .av-cell-col-2, .av-cell-col-3, .av-cell-col-4, .av-cell-col-5, .av-cell-col-6 {
        display: block !important;
        width: 100% !important;
    }

    /* ------------------------------------------------------------------
     * 4. Botones: tamaño cómodo para dedo
     * ------------------------------------------------------------------ */
    .avia-button,
    .avia_iconbox_title a,
    .button {
        padding: 14px 24px !important;
        font-size: 15px !important;
        line-height: 1.3 !important;
        border-radius: 30px !important;
    }
    .avia-button.av-large { font-size: 16px !important; padding: 16px 28px !important; }
    .avia-button.avia-button-fullwidth { width: 100% !important; display: block !important; }

    /* Centra los CTAs que en desktop van inline */
    .avia_textblock + .avia-button-wrap,
    .avia-button-wrap {
        text-align: center !important;
    }

    /* ------------------------------------------------------------------
     * 5. Hero / Slideshow / Color sections
     * ------------------------------------------------------------------ */
    .avia-slideshow,
    .avia-fullwidth-slider {
        min-height: 70vh !important;
    }
    .avia-slideshow .slideshow_caption,
    .avia-slideshow-inner .slideshow_caption {
        padding: 20px 16px !important;
        max-width: 100% !important;
    }
    .slideshow_caption h1, .slideshow_caption h2 {
        font-size: 26px !important;
        line-height: 1.2 !important;
    }
    .avia-slideshow-arrows { display: none !important; }
    .avia-slideshow-dots { bottom: 14px !important; }

    /* Secciones con imagen de fondo: asegurar que el texto tenga aire */
    .av-parallax, .av-parallax-inner { background-attachment: scroll !important; }
    [data-section-bg-repeat] .container { padding-top: 20px !important; padding-bottom: 20px !important; }

    /* ------------------------------------------------------------------
     * 6. Iconlists / Iconboxes / counters
     * ------------------------------------------------------------------ */
    .iconlist_icon {
        width: 40px !important;
        height: 40px !important;
        line-height: 40px !important;
        font-size: 18px !important;
    }
    .iconlist_content { padding-left: 55px !important; }

    .avia_iconbox { padding: 16px !important; margin-bottom: 16px !important; }
    .avia_iconbox_title { font-size: 17px !important; margin-bottom: 8px !important; }

    /* Contadores / números (Enfold progress-bar y counter) */
    .av_counter_number,
    .heading-tag.av-special-heading-tag {
        font-size: 38px !important;
    }

    /* ------------------------------------------------------------------
     * 7. Galerías / portfolio / masonry
     * ------------------------------------------------------------------ */
    .avia-gallery-thumb li { width: 33.333% !important; }
    .avia-gallery.avia-gallery-1 li,
    .avia-gallery.avia-gallery-big ul li { width: 100% !important; }

    .grid-entry,
    .portfolio-grid .post,
    .av-masonry-entry {
        width: 100% !important;
        clear: both !important;
    }
    .av-masonry .av-inner-masonry { width: 100% !important; }

    /* ------------------------------------------------------------------
     * 8. Formularios (contacto, CF7, avia ajax)
     * ------------------------------------------------------------------ */
    input[type="text"],
    input[type="email"],
    input[type="tel"],
    input[type="url"],
    input[type="number"],
    textarea,
    select,
    .ajax_form input,
    .ajax_form textarea,
    .avia_ajax_form input,
    .avia_ajax_form textarea,
    .wpcf7-form-control {
        width: 100% !important;
        box-sizing: border-box !important;
        padding: 14px !important;
        font-size: 15px !important;
        border-radius: 10px !important;
    }
    textarea { min-height: 110px !important; }

    .avia_ajax_form .button,
    .avia_ajax_form input[type="submit"],
    .wpcf7-submit {
        width: 100% !important;
        padding: 15px !important;
        font-size: 15px !important;
    }

    /* Checkbox/radio de privacidad: inline con la etiqueta */
    input[type="checkbox"], input[type="radio"] {
        width: auto !important;
        margin-right: 6px !important;
    }

    /* ------------------------------------------------------------------
     * 9. Tablas — permite scroll horizontal interno si no caben
     * ------------------------------------------------------------------ */
    .avia-data-table-wrap, .entry-content-wrapper table {
        display: block !important;
        width: 100% !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
    }

    /* ------------------------------------------------------------------
     * 10. Breadcrumbs
     * ------------------------------------------------------------------ */
    .breadcrumb, .avia-breadcrumb, .breadcrumbs {
        font-size: 12px !important;
        padding: 8px 16px !important;
        flex-wrap: wrap !important;
        line-height: 1.5 !important;
    }

    /* ------------------------------------------------------------------
     * 11. Título de página (title container de Enfold)
     * ------------------------------------------------------------------ */
    .stretch_full_title, .title_container {
        padding: 24px 16px !important;
    }
    .stretch_full_title h1, .title_container h1 {
        font-size: 26px !important;
        line-height: 1.2 !important;
    }

    /* ------------------------------------------------------------------
     * 12. Footer — columnas apiladas y legibles
     * ------------------------------------------------------------------ */
    #footer { padding: 30px 16px !important; }
    #footer .container { padding: 0 !important; }
    #footer .flex_column,
    #footer .av_one_fourth,
    #footer .av_one_third,
    #footer .av_one_half {
        margin-bottom: 18px !important;
        padding-bottom: 18px !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
    }
    #footer .flex_column:last-child,
    #footer .av_one_fourth:last-child,
    #footer .av_one_third:last-child {
        border-bottom: none !important;
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
    }
    #footer h3, #footer h4, #footer .widgettitle {
        font-size: 14px !important;
        margin-bottom: 10px !important;
        letter-spacing: 0.3px !important;
    }
    #footer ul, #footer .widget { padding: 0 !important; margin: 0 0 8px !important; list-style: none !important; }
    #footer li { padding: 4px 0 !important; }
    #footer p, #footer li, #footer a { font-size: 13px !important; line-height: 1.5 !important; }

    /* Socket (barra inferior del footer) */
    #socket { padding: 18px 16px !important; font-size: 12px !important; text-align: center !important; }
    #socket .container { display: block !important; }
    #socket .copyright, #socket .sub_menu_socket {
        float: none !important;
        text-align: center !important;
        display: block !important;
        margin: 6px 0 !important;
    }

    /* ------------------------------------------------------------------
     * 13. Widgets genéricos
     * ------------------------------------------------------------------ */
    .widget { padding: 0 !important; }
    .widgettitle { font-size: 14px !important; }

    /* ------------------------------------------------------------------
     * 14. Redes sociales / iconos de cabecera movidos al drawer
     * ------------------------------------------------------------------ */
    .av_social_header { display: none !important; }
    #header_meta { display: none !important; }

    /* ------------------------------------------------------------------
     * 15. Post / blog listado
     * ------------------------------------------------------------------ */
    .post-entry { margin-bottom: 28px !important; }
    .post-entry .post-title { font-size: 20px !important; line-height: 1.3 !important; }
    .post-meta-infos { font-size: 12px !important; }

    /* Sidebar — abajo, claramente separado */
    .sidebar, #sidebar {
        width: 100% !important;
        padding: 24px 0 0 !important;
        border-top: 1px solid rgba(0,0,0,0.08) !important;
        margin-top: 24px !important;
    }

    /* ------------------------------------------------------------------
     * 16. Extras específicos OYRSA
     * ------------------------------------------------------------------ */

    /* Bloque "Cómo trabajamos" — iconos ya apilan a 2 cols por tu CSS existente */

    /* Sección de clientes con logos: galería comprimida */
    .patrocinios-galeria img { max-height: 80px !important; object-fit: contain !important; }

    /* Post navigation */
    .post_nav2 { padding: 20px 16px !important; }

    /* Ofertas de empleo (CPT) */
    .oyrsa-ofertas-shortcode { padding: 0 !important; }
    .oyrsa-formulario-oferta { padding: 16px !important; }
}

/* ============================================================================
 * Pantallas muy pequeñas (<= 400px) — ajustes finos
 * ============================================================================ */
@media (max-width: 400px) {
    h1, .page-title, .entry-title { font-size: 24px !important; }
    h2 { font-size: 20px !important; }
    .container { padding-left: 14px !important; padding-right: 14px !important; }
    .avia-button { padding: 12px 20px !important; font-size: 14px !important; }
	.responsive #top .logo{margin-top:0;}
	.responsive #top .logo{
		position:initial
	}

	.html_stretched #wrap_all{
		    padding-top: 0;
	}
	body:not(.home) .responsive #top #wrap_all .av-logo-container{
		        background-color: #262e60;
        width: 100%;
        max-width: 100%;
	}
	body.home .responsive #top #wrap_all .av-logo-container{
		       
        width: 100%;
        max-width: 100%;
	}
	
}