
/* Ancho central equivalente al area de estudio de Tecnica / Embocadura. */
.flautea-history-layout {
    box-sizing: border-box;
    width: 100% !important;
    max-width: 1160px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-inline: 0 !important;
    overflow-x: clip;
}
.flautea-history-layout > .fh,
.flautea-history-layout > article.fh,
.flautea-history-layout > div.fh,
.flautea-history-layout .fh {
    box-sizing: border-box;
    width: 100% !important;
    max-width: 1160px !important;
    min-width: 0;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-inline: 22px !important;
}
/* El texto, figuras y secciones comparten el ancho de la pagina. */
.flautea-history-layout .fh .fh-article,
.flautea-history-layout .fh .fh-lead,
.flautea-history-layout .fh .fh-figure,
.flautea-history-layout .fh .fh-source,
.flautea-history-layout .fh .fh-nav,
.flautea-history-layout .fh .fh-grid,
.flautea-history-layout .fh .fh-guide,
.flautea-history-layout .fh .fh-intro,
.flautea-history-layout .fh .fh-section {
    box-sizing: border-box;
    width: 100% !important;
    max-width: 100% !important;
}
.flautea-history-layout .fh .fh-article > p,
.flautea-history-layout .fh .fh-lead,
.flautea-history-layout .fh .fh-article .fh-callout,
.flautea-history-layout .fh .fh-article .fh-source,
.flautea-history-layout .fh .fh-article .fh-source p {
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}
.flautea-history-layout .fh figure,
.flautea-history-layout .fh figure img,
.flautea-history-layout .fh .fh-figure img,
.flautea-history-layout .fh svg {
    max-width: 100% !important;
    height: auto;
}
.flautea-history-layout .fh .fh-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 270px), 1fr));
    gap: 20px;
}
.flautea-history-layout .fh .fh-card,
.flautea-history-layout .fh .fh-body {
    min-width: 0;
}
.flautea-history-layout .fh h1,
.flautea-history-layout .fh h2,
.flautea-history-layout .fh h3 {
    max-width: 100% !important;
}
@media (max-width: 768px) {
    .flautea-history-layout .fh {
        padding-inline: 16px !important;
    }
    .flautea-history-layout .fh h1 {
        font-size: clamp(30px, 8vw, 46px);
        overflow-wrap: break-word;
    }
    .flautea-history-layout .fh .fh-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}
