/* Layout adaptativo y fluido */
* {
    box-sizing: border-box;
}

body {
    margin: 0;
    padding: 0;
    width: 100%;
}

#header_tall, #main {
    width: 100%;
    max-width: 980px;
    margin: 0 auto;
    padding: 0 10px;
}

#header {
    width: 100%;
}

/* Logo centrado */
.h_logo {
    display: flex;
    justify-content: center; /* Centra el logo horizontalmente */
    align-items: center;
    text-align: center;
    flex-wrap: wrap;
    padding: 15px 0;
    width: 100%;
}

.h_logo .left {
    float: none;
    display: block;
    width: 100%;
    margin: 0 auto;
}

.h_logo img {
    width: 100%;
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
}

/* Menú de Navegación Flexible */
#menu ul {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    padding: 0;
    margin: 0;
}

#menu ul li {
    flex: 1 1 auto;
    text-align: center;
}

#menu ul li a, #menu ul li span {
    display: block;
    padding: 10px 15px;
    white-space: nowrap;
    font-family: 'Montserrat', sans-serif;
}

/* Video de Intro centrado y ajustado al ancho completo del logo */
.intro {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin: 15px 0;
}

.intro video {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    margin: 0 auto;
}

/* Estructura de Columnas (Flexbox / Grid) */
.columns1 {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 15px;
}

.column1, .column2 {
    flex: 1 1 300px;
    width: 100%;
}

.indent_column {
    display: none;
}

/* Contenido e imágenes responsivas */
.pd img, .padding img {
    max-width: 100%;
    height: auto;
}

.clear {
    clear: both;
}

/* Footer responsivo */
#footer {
    width: 100%;
    max-width: 980px;
    margin: 20px auto 10px auto;
    text-align: center;
    padding: 15px;
}

/* Adaptación específica para Pantallas Móviles */
@media screen and (max-width: 768px) {
    #menu ul {
        flex-direction: column;
    }
    
    #menu ul li {
        width: 100%;
    }

    .columns1 {
        flex-direction: column;
    }

    .pd img {
        float: none !important;
        margin: 0 auto 15px auto !important;
        display: block;
    }
}