/* ===========================================================
   Colección EFC — transferido de Maqueta_EFC/style/default.css
   (+ responsive.css al final).

   CÓMO SE COMBINA CON EL THEME MALBA
   ----------------------------------
   Este theme hereda de `malba`, así que el navegador carga PRIMERO
   malba/custom.css y DESPUÉS este archivo. O sea:

   - lo que EFC redefine (tipografías, header, footer, tamaños) gana acá;
   - lo que EFC no menciona sigue viniendo de malba, y eso es deliberado:
     ahí están los comportamientos que la maqueta no contempla porque es
     estática —columna de filtros pegajosa, control de orden, estado activo
     del abecedario, flechas sin recuadro, miniaturas con su proporción—.

   El bloque @font-face se sacó de acá: vive en fonts.css de este theme.
   =========================================================== */

/***GLOBAL VARIABLES
*****************************************************/
:root {
    /***TEXT***/
    /*--fontSize: clamp(1rem, 1.25vw, 1.5rem);*/
    /* Tamaño agregado por la maqueta del 2026-09-10 (default.css:6). No estaba
     * en la entrega anterior, con la que se armó este theme: la clase
     * .font_size_xxsmall se usaba en el markup y no existía en el CSS, así que
     * el texto salía al tamaño heredado. */
    --fontSizeXXSmall: 0.75rem;
    --fontSizeXSmall: 1rem;
    --fontSizeSmall: 1.3rem;
    --fontSizeMedium: 1.75rem;
    --fontSizeLarge: 3.6rem;
    --fontSizeXLarge: 5.5rem;
    --fontSizeLogo: 1.6rem;
    --fontWeight: 400;
    --letterSpacing: 0.01em;
    --wordSpacing: 0em;
    --lineHeightHigh: 1.4;
    --lineHeightNatural: 1.2;
    --lineHeightLow: 1;
    /***FONTS***/
    --Arial: Arial, Helvetica, sans-serif;
    --GaramondRegular: "Garamond Regular", Arial, Helvetica, sans-serif;
    --GaramondRegularItalic: "Garamond Regular Italic", Arial, Helvetica, sans-serif;
    /***SPACES***/
    --spaceY: var(--fontSizeSmall);
    --spaceX: calc(var(--fontSizeMedium) * var(--lineHeightHigh));
    --bodySpaces: 0;
    --rowGutterXSmall: calc(var(--fontSizeXSmall) * var(--lineHeightHigh));
    --rowGutterSmall: calc(var(--fontSizeSmall) * var(--lineHeightHigh));
    --rowGutterMedium: calc(var(--fontSizeMedium) * var(--lineHeightHigh));
    --rowGutterLarge: calc(var(--fontSizeLarge) * var(--lineHeightLow));
    --rowGutterLogo: calc(var(--fontSizeLogo) * var(--lineHeightLow));
    --rowGutterBetweenSections: calc(var(--rowGutterMedium) * 3);
    --colGutter: calc(var(--spaceX)*0.33);
    --mainTopSpace: var(--headerHeight);
    --mainBottomSpace: calc(var(--rowGutterMedium) * 3);
    /***SIZES***/
    --headerHeight: calc(var(--spaceY)*2 + var(--fontSizeSmall));
    --headerHeightXSmall: calc(var(--spaceY)*2 + var(--rowGutterXSmall));
    --headerHeightSmall: calc(var(--spaceY)*2 + var(--rowGutterSmall));
    --headerHeightMedium: calc(var(--spaceY)*2 + var(--rowGutterMedium));
    --headerHeightLarge: calc(var(--spaceY)*2 + var(--rowGutterLarge));
    --headerHeightXLarge: calc(var(--spaceY)*2 + var(--rowGutterXLarge));
    --footerHeight: calc(var(--spaceY)*2 + var(--rowGutterSmall));
    --mainWidth: 1800px;
    --mainHeight: calc(100vh - var(--headerHeight) - var(--mainBottomSpace) - var(--footerHeight));
    --colWidth: calc((100vw - var(--spaceX)*2 - var(--colGutter)*var(--gridGutters)) / var(--gridColumns));
     --tagHeight: calc(var(--rowGutterXSmall) + var(--fontSizeXSmall)*1.1);
    
    /***GRIDS***/
    --gridColumns: 12;
    --gridGutters: calc(var(--gridColumns) - 1);
    --gridTemplate: repeat(var(--gridColumns), 1fr);
    --gridTemplateInner: repeat(9, 1fr);
    --gridGap: calc(var(--rowGutterMedium)*2) var(--colGutter);
    /***COLOR***/
    --paletteWhite: #FFFFFF;
    --paletteGray: #999999;
    --paletteBlack: #000000;
    --paletteViolet: mediumslateblue;
    --paletteAlpha: transparent;
    --backColor: var(--paletteWhite);
    --textColor: var(--paletteBlack);
    --linkColor: var(--paletteBlack);
    --hoverColor: var(--paletteGray);
    /***DECORATION***/
    --linkDeco: underline;
    --borderWidth: 1px;
    --borderLine: var(--borderWidth) solid var(--textColor);
    /***TRANSITION***/
    --transitionDuration: 0.15s;
    --transitionDurationSlow: 0.3s;
}
  
/***FONTS
*****************************************************/
* {
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -o-text-size-adjust: 100%;
	text-size-adjust: 100%;
    -webkit-font-smoothing: smooth;
	-moz-font-smoothing: smooth;
    -moz-osx-font-smoothing: smooth;
	-ms-font-smoothing: smooth;
    -o-font-smoothing: smooth;
    text-rendering: geometricPrecision;
}
.font_size_xxsmall {
    font-size: var(--fontSizeXXSmall);
    letter-spacing: var(--letterSpacing);
    line-height: var(--lineHeightNatural);
}
.font_size_xsmall {
    font-size: var(--fontSizeXSmall);
    letter-spacing: var(--letterSpacing);
    line-height: var(--lineHeightHigh);
}
.font_size_small {
    font-size: var(--fontSizeSmall);
    letter-spacing: var(--letterSpacing);
    line-height: var(--lineHeightHigh);
}
.font_size_medium {
    font-size: var(--fontSizeMedium);
    letter-spacing: var(--letterSpacing);
    line-height: var(--lineHeightHigh);
}
.font_size_large {
    font-size: var(--fontSizeLarge);
    letter-spacing: 0px;
    line-height: var(--lineHeightLow);
}
.font_size_xlarge {
    font-size: var(--fontSizeXLarge);
    letter-spacing: 0px;
    line-height: var(--lineHeightLow);
}
.font_size_logo {
    font-size: var(--fontSizeLogo);
    letter-spacing: 0px;
    line-height: var(--lineHeightLow);
}
.italic, i, em {
    font-family: var(--GaramondRegularItalic);
}
.uppercase {
    text-transform: uppercase;
}
.capitalize {
    text-transform: capitalize;
}
.lowercase {
    text-transform: lowercase;
}

/***RESET
*****************************************************/
::-webkit-scrollbar {
    display: none;
}
::-webkit-selection {
    color: var(--backColor);
    background-color: var(--textColor);
}
::-moz-selection {
    color: var(--backColor);
    background-color: var(--textColor);
}
::-ms-selection {
    color: var(--backColor);
    background-color: var(--textColor);
}
::-o-selection {
    color: var(--backColor);
    background-color: var(--textColor);
}
::selection {
    color: var(--backColor);
    background-color: var(--textColor);
}
img::-webkit-selectio {
    color: transparent;
    background-color: transparent;
}
img::-moz-selection {
    color: transparent;
    background-color: transparent;
}
img::-ms-selection {
    color: transparent;
    background-color: transparent;
}
img::-o-selection {
    color: transparent;
    background-color: transparent;
}
img::selection {
    color: transparent;
    background-color: transparent;
}
*,
*::before,
*::after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}
html {
    /*color-scheme: light dark;*/
    scroll-behavior: smooth;
}
body {
    position: relative;
    margin: var(--bodySpaces);
    font-family: var(--GaramondRegular);
    color: var(--textColor);
    background: var(--backColor);
}
ul {
    display: block;
    list-style-type: none;
    margin-block-start: 0;
    margin-block-end: 0;
    margin-inline-start: 0;
    margin-inline-end: 0;
    padding-inline-start: 0;
}
li {
  display: inline;
}
a {	
    color: var(--linkColor);
    text-decoration: none;
}
a, span {	
    transition-property: color;
    transition-duration: var(--transitionDuration);
}
a:hover {	
    color: var(--hoverColor);
    transition-property: color;
    transition-duration: var(--transitionDuration);
}
h1, h2, h3 {
    margin: 0;
    margin-block-start: 0;
    margin-block-end: 0;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding: 0;
    font-size: var(--fontSizeMedium);
    font-style: normal;
    font-weight: 400;
}
p {
    display: block;
    margin-block-start: 0;
    margin-block-end: 0;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 0;
}
span {
    display: inline;
}
form, input, textarea, submit,
iframe, embed, audio {
    margin: 0;
    padding: 0;
    color: var(--textColor);
    background: transparent;
    border: 0;
    outline: none;
    font: inherit;
    font-size: inherit;
}
input:focus, textarea:focus {
    outline: none;
}
input[name="submit"] {
	cursor: pointer;
}
:-webkit-input-placeholder {
	/*internet explorer*/
	color: var(--textColor);
}
::-moz-input-placeholder {
	/*mozilla edge*/
    color: var(--textColor);
}
::-ms-input-placeholder {
	/*microsoft edge*/
    color: var(--textColor);
}
::-o-input-placeholder {
	/*microsoft edge*/
    color: var(--textColor);
}
::placeholder {
	/*chrome, firefox, opera, safari*/
    color: var(--textColor);
}
img, video {
    vertical-align: middle;
}
img.lazy,
video.lazy {
    opacity: 0;
    transition: opacity var(--transitionDuration);
}
img.lazy.loaded,
video.lazy.loaded {
    opacity: 1;
}

/***HEADER AND MENU
*****************************************************/
header {
    width: 100%;
    height: var(--headerHeight);
    position: fixed;
    top: 0;
    padding: calc(var(--spaceY)*1.1) var(--spaceX) calc(var(--spaceY)*0.9);
    display: flex;
    justify-content: space-between;
    align-items: center;
    z-index: 100;
    transition-property: background;
    transition-duration: var(--transitionDurationSlow);
}
header:not(.alpha) {
    background: var(--backColor);
}
header.alpha {
    background: transparent;
}
header:not(.dark) {
    color: var(--paletteBlack);
    background: var(--paletteWhite);
}
header.dark {
    color: var(--paletteWhite);
    background: var(--paletteBlack);
}
header.dark a {
    color: var(--paletteWhite);
}
header.alpha.on,
header.on {
    background: var(--paletteBlack);
    color: var(--paletteWhite);
}
header.alpha.on a,
header.on a {
    color: var(--paletteWhite);
}
header.alpha.on a:hover,
header.on a:hover {
    color: var(--paletteGray);
}
nav.header_menu ul {
    display: flex;
    justify-content: space-between;
    gap: var(--colGutter);
    width: calc(var(--colWidth)*6 + var(--colGutter)*5);
}
nav.header_menu .search_button {
    position: relative;
}
nav.header_menu .search_button svg.button_icon {
    height: var(--fontSizeXSmall);
}
nav.header_menu .search_button svg.button_icon path {
    vector-effect: non-scaling-stroke;
}
nav.header_menu .search_button svg.search_close_button {
    position: absolute;
    top: 0;
    right: 0;
    height: var(--rowGutterXSmall);
    transform-origin: center;
    transform: rotate(45deg);
    opacity: 0;
    transition-property: opacity;
    transition-duration: var(--transitionDuration);
}
nav.header_menu .search_button svg.search_close_button line {
    fill: none;
    stroke: var(--paletteWhite);
    stroke-width: 1px;
    stroke-linecap: butt;
    stroke-miterlimit: 10;
    vector-effect: non-scaling-stroke;
}
header.dark nav.header_menu .search_button svg.search_close_button {
    opacity: 1;
}
header.dark nav.header_menu .search_button svg.button_icon {
    opacity: 0;
}
/* 25-sep-2026 (Matías, sesión malba-templates): se excluye la barra de solapas de resultados de búsqueda
   (<div class="search search_results_nav"> en malba-2026/views/Search/multisearch_results_html.php). También lleva
   la clase .search, y esta regla la ocultaba en pantallas de más de 480 px: no se veían las solapas «Obras» y
   «Artistas», así que los artistas encontrados quedaban inaccesibles. La regla sigue ocultando la barra de búsqueda
   de Malba (malba-2026/views/pageFormat/searchBar.php), que es su propósito. */
div.search:not(.results):not(.search_results_nav) {
    display: none;
}
@media (max-width: 480px) {
    div.search:not(.results) {
        display: flex;
    }
}
header .lang_button {
    transition-property: opacity;
    transition-duration: var(--transitionDurationSlow);
}
header:not(.on) .lang_button {
    opacity: 0;
    pointer-events: none;
}
header.on .lang_button {
    opacity: 1;
}
header.alpha .lang_button a:hover {
    color: var(--paletteGray);
}
nav.header_menu a:hover,
nav.header_menu span:hover {
    color: var(--paletteGray);
    cursor: pointer;
}
.menu_button_button {
    display: none;
    cursor: pointer;
}
.menu_mobile {
    display: none;
}

/***SEARCH
*****************************************************/
/* 14-sep-2026: acotado a nav.search; la clase suelta .search también la lleva el contenedor de resultados del
   core en Search/works ("ca_objects works search results") y con position:fixed + opacity:0 la página salía en blanco. */
nav.search {
    position: fixed;
    top: var(--headerHeight);
    left: 0px;
    z-index: 300;
    display: flex;
    align-items: center;
    justify-content: end;
    gap: var(--rowGutterLarge) var(--colGutter);
    width: 100vw;
    height: calc(100vh - var(--headerHeight));
    padding: var(--mainTopSpace) var(--spaceX) calc(var(--spaceY) * 3);
    background: var(--paletteBlack);
    transition-property: opacity;
    transition-duration: var(--transitionDurationSlow);
}
nav.search:not(.on) {
    opacity: 0;
    pointer-events: none;
}
nav.search.on {
    opacity: 1;
    pointer-events: auto;
}
nav.search .search_form {
    position: relative;
    width: calc(var(--colWidth) * 6 + var(--colGutter) * 5);
    padding-bottom: calc(var(--spaceY) * 0.25);
    border-bottom: 1px solid var(--paletteWhite);
}
nav.search input,
nav.search input::placeholder {
    color: var(--paletteWhite);
}
nav.search .action_button {
    position: absolute;
    right: 0;
    bottom: calc(var(--spaceY)*0.5);
}
nav.search .action_button .button_icon {
    margin-right: calc(var(--latinxTextSmall) * 0.5);
    align-self: center;
    width: calc(var(--fontSizeLarge) * 0.75);
    height: calc(var(--fontSizeLarge) * 0.75);
    fill: none;
    stroke: var(--paletteWhite);
    stroke-width: 2px;
    stroke-linecap: butt;
}

/***MAIN TEMPLATE
*****************************************************/
main.content {
    position: relative;
    margin-inline: auto;
    margin-top: calc(var(--mainTopSpace)*1);
    margin-bottom: var(--mainBottomSpace);
    max-width: auto;
    min-height: var(--mainHeight); 
}
body#index main.content {
    margin-top: calc(var(--mainTopSpace)*2);
    margin-bottom: var(--mainBottomSpace);
}
body#acerca main.content section {
    padding-top: var(--spaceY);
}
body:not(#acerca) section:not(:first-child) {
    margin-top: var(--rowGutterBetweenSections);
}

/***SECIONS***/
section .section_header,
section:not(.artwork_text) .text,
section .grid .grid_stack,
section .list {
    padding-inline: var(--spaceX);
}
section .section_header {
    display: flex;
    column-gap: var(--colGutter);
    justify-content: space-between;
    align-items: center;
    padding-block: var(--spaceY);
    background: var(--paletteWhite);
}
section .section_header.dark {
    color: var(--paletteWhite);
    background: var(--paletteBlack);
}
body#artworks section .section_header {
    position: sticky;
    top: var(--headerHeight);
}
section .section_header .header_nav {
    display: flex;
    justify-content: start;
    column-gap: var(--spaceX);
}
section .section_header .header_nav a {
    color: var(--paletteGray);
}
section .section_header .header_nav a.active,
section .section_header .header_nav a:hover {
    color: var(--paletteBlack);
}
section .section_header .header_actions {
    display: flex;
    justify-content: end;
    column-gap: calc(var(--colGutter) * 0.75);
    width: calc(var(--colWidth)*6 + var(--colGutter)*5);
}
section .section_header .header_actions .action_input {
    padding-bottom: calc(var(--spaceY)*0.25);
    border-bottom: 1px solid var(--textColor);
    flex-grow: 1;
}
section .section_header .header_actions .action_button,
section .section_sub_header .sub_header_actions .action_button,
section .section_footer .footer_actions .action_button,
.sheet .sheet_data .data_action .action_button {
    border: 1px solid var(--textColor);
    padding: calc(var(--fontSizeXSmall)*0.35) calc(var(--fontSizeXSmall)*1) calc(var(--fontSizeXSmall)*0.25);
    background: var(--paletteWhite);
    border-radius: 2px;
    cursor: pointer;
    transition-property: color, background, border-color, padding;
    transition-duration: var(--transitionDuration);
}
section .section_header .header_actions .action_button:hover,
section .section_sub_header .sub_header_actions .action_button:hover,
section .section_footer .footer_actions .action_button:hover,
.sheet .sheet_data .data_action .action_button:hover {
    color: var(--paletteWhite);
    background: var(--paletteBlack);
}
section .section_header.dark .header_actions .action_button {
    border: 1px solid var(--paletteWhite);
    color: var(--paletteWhite);
    background: var(--paletteBlack);
}
section .section_header.dark .header_actions .action_button:hover {
    color: var(--paletteBlack);
    background: var(--paletteWhite);
}
section .section_header .header_actions a.action_button:hover,
section .section_sub_header .sub_header_actions a.action_button:hover,
section .section_footer .footer_actions a.action_button:hover,
.sheet .sheet_data .data_action a.action_button:hover {
    padding-right: calc(var(--fontSizeXSmall) * 2.25);
}
.sheet .sheet_data .data_action {
    margin-top: calc(var(--spaceY)*2);
}
section .section_header .header_actions .action_button .arrow,
section .section_sub_header .sub_header_actions .action_button .arrow,
section .section_footer .footer_actions .action_button .arrow,
.sheet .sheet_data .data_action .action_button .arrow {
    position: absolute;
    margin-left: calc(var(--fontSizeXSmall) * 0.5);
    opacity: 0;
    pointer-events: none;
    transition-property: opacity;
    transition-duration: var(--transitionDuration);
    transition-delay: 0;
}
.sheet .sheet_data .data_action .action_button .arrow {
    margin-top: calc(var(--fontSizeXSmall) * 0.35);
}
section .section_header .header_actions .action_button:hover .arrow,
section .section_sub_header .sub_header_actions .action_button:hover .arrow,
section .section_footer .footer_actions .action_button:hover .arrow,
.sheet .sheet_data .data_action .action_button:hover .arrow {
    opacity: 1;
    transition-delay: 0.15s;
}
section .section_filters {
    display: grid;
    grid-template-columns: var(--gridTemplate);
    grid-gap: var(--gridGap);
    align-items: start;
    padding-inline: var(--spaceX);
    margin-top: var(--spaceY);
}
section .section_filters .tags {
    grid-column: 7/13;
}
section .section_footer {
    margin-top: var(--spaceY);
    text-align: center;
}
.list .list_footer a {
    text-decoration: var(--linkDeco);
}

/***INTRO MULTIMEDIA***/
section#intro_media {
    width: 100%;
    height: 100vh;  
    position: relative;
}
section#intro_media img,
section#intro_media video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

/***FILTERS***/
.section_sub_header {
    margin-top: calc(var(--rowGutterMedium)*2);
    padding-block: var(--spaceY);
    padding-inline: var(--spaceX);
    display: flex;
    column-gap: var(--colGutter);
    justify-content: space-between;
    align-items: center;
}
.section_sub_header .sub_header_actions {
    display: flex;
    column-gap: var(--spaceX);
    /*justify-content: space-between;*/
    justify-content: end;
    align-items: center;
    min-width: calc(var(--colWidth)*6 + var(--colGutter)*5)
}
.section_sub_header .sub_header_actions .action_filters {
    display: flex;
    column-gap: var(--spaceX);
    justify-content: start;
    align-items: center;
}
.checkbox {
    cursor: pointer;
}
.checkbox:before {
    content: "";
    display: inline-block;
    margin-right: calc(var(--fontSizeXSmall)*0.5);
    width: calc(var(--fontSizeXSmall)*0.75);
    height: calc(var(--fontSizeXSmall)*0.75);
    border: var(--borderLine);
    border-radius: 50%;
    transition-property: color, background;
    transition-duration: var(--transitionDuration);
}
.checkbox:hover:before {
    background: var(--paletteBlack)
}
.filterable {
    position: relative;
    display: flex;
    /*right: calc(var(--colWidth)*3 + var(--colGutter)*2);*/
    flex-wrap: nowrap;
    overflow-x: hidden;
    transition-property: right;
    transition-duration: var(--transitionDurationSlow);
}
.artworks > .tags,
.artists > .tags {
    padding-inline: var(--spaceX);
    padding-block: 0 var(--spaceY);
}
.artists > .alphabet {
    display: flex;
    justify-content: space-between;
    gap: calc(var(--spaceY)*0.5) calc(var(--spaceX)*0.5);
    padding-inline: var(--spaceX);
    padding-block: 0 var(--spaceY);
}
.artists > .alphabet a.alphabet_button {
    color: var(--paletteGray);
}
.artists > .alphabet a.alphabet_button:hover {
    color: var(--paletteBlack);
}
.artworks > .tags .tag_button svg.plus_cross,
.artists > .tags .tag_button svg.plus_cross {
    display: inline-block;
    height: calc(var(--rowGutterXSmall)*0.6);
    transform-origin: center;
    transition-property: transform;
    transition-duration: var(--transitionDurationSlow);
    transform: rotate(45deg) translate(25%, -5%);
}
.artworks > .tags .tag_button svg.plus_cross line,
.artists > .tags .tag_button svg.plus_cross line {
    fill: none;
    stroke: var(--paletteBlack);
    stroke-width: 1px;
    stroke-linecap: butt;
    stroke-miterlimit: 10;
    vector-effect: non-scaling-stroke;
}
.filterable .filters {
    position: relative;
    width: calc(var(--colWidth)*3 + var(--colGutter)*3 - var(--spaceX));
    flex-shrink: 0;
}
.filterable .grid,
.filterable .list,
.filterable .filters {
    transition-property: right;
    transition-duration: var(--transitionDurationSlow);
}
.filterable:not(.filters_on) .grid,
.filterable:not(.filters_on) .list,
.filterable:not(.filters_on) .filters {
    right: 0;
    overflow: hidden;
}
.filterable.filters_on .grid,
.filterable.filters_on .list,
.filterable.filters_on .filters {
    right: calc(var(--colWidth)*3 + var(--colGutter)*3);
}
.filterable .filters .filters_toggle {
    display: flex;
    flex-direction: column;
    row-gap: calc(var(--rowGutterXSmall) * 0.3);
    margin-bottom: calc(var(--spaceY) * 1 + var(--rowGutterXSmall));
    padding-top: calc(var(--spaceY) * 0.5);
    border-top: var(--borderLine);
}
.filterable .filters .filters_row {
    padding-block: calc(var(--spaceY) * 0.5);
    border-top: var(--borderLine);
}
.filterable .filters .filters_row:last-child {
    border-bottom: var(--borderLine);
}
.filters .filters_row .row_title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    cursor: pointer;
}
.filters_row .row_title svg.plus_cross {
    height: calc(var(--rowGutterXSmall)*0.6);
    transform-origin: center;
    transition-property: transform;
    transition-duration: var(--transitionDurationSlow);
}
.filters_row.open .row_title svg.plus_cross {
    transform: rotate(45deg);
}
.filters_row .row_title .plus_cross line {
    fill: none;
    stroke: var(--paletteBlack);
    stroke-width: 1px;
    stroke-linecap: butt;
    stroke-miterlimit: 10;
    vector-effect: non-scaling-stroke;
}
.filters .filters_row .row_list {
    display: grid;
    padding-top: calc(var(--rowGutterXSmall)*0.5);
    padding-bottom: calc(var(--spaceY) * 0.5 + var(--rowGutterXSmall));
    transition-property: padding-bottom, grid-template-rows, opacity;
    transition-duration: var(--transitionDurationSlow);
}
.filters .filters_row:not(.open) .row_list {
    grid-template-rows: 0fr;
    padding-block: 0;
    opacity: 0;
}
.filters .filters_row .row_list > .list_stack {
    overflow-y: hidden;
    display: flex;
    flex-direction: column;
    row-gap: calc(var(--rowGutterXSmall)*0.3);
}
.filters .filters_row .row_list > .list_stack .stack_item.range {
    display: flex;
    column-gap: var(--colGutter);
}
.list_stack .stack_item.range .item_input,
.list_stack .stack_item.range .item_input input {
    width: 100%
}
.list_stack .stack_item.range .item_input input {
    border: var(--borderLine);
    border-radius: 0;
    padding: 3px 5px 1px;
}

/***TEXT***/
#intro_text .text p {
    grid-column: 4/13;
    column-count: 1;
    column-gap: var(--colGutter);
}
.about_text {
    position: relative;
    padding-inline: var(--spaceX);
}
.about_text .section_anchor {
    position: absolute;
    transform: translateY(-100%);
    top: 0;
    height: var(--headerHeight);
}
.about_text .section_content {
    display: grid;
    grid-template-columns: var(--gridTemplate);
    grid-gap: var(--gridGap);
    padding-bottom: calc(var(--mainTopSpace) + var(--spaceY));
}
.about_text:not(:last-child) .section_content {
    border-bottom: var(--borderLine);
}
.about_text .section_content .content_title {
    position: sticky;
    top: calc(var(--headerHeight) + var(--spaceY));
    grid-column: 1/7;
    align-self: start;
}
.about_text .section_content .content_text {
    grid-column: 7/13;
}


/***THUMBS GRID***/
.grid {
    position: relative;
    display: grid;
    grid-template-columns: var(--gridTemplate);
    grid-gap: var(--gridGap);
    width: 100vw;
    padding-inline: var(--spaceX);
    flex-shrink: 0;
}
.grid .grid_item {
    grid-column: span 3;
}
.grid .grid_item .item_media {
    display: flex;
    justify-content: center;
    align-items: center;
}
.grid .grid_item.full .item_media {
    aspect-ratio: 16/9;
}
.grid .grid_item.full .item_media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.grid .grid_item .item_media img {
    width: 100%;
    max-height: auto;
    object-fit: contain;
    object-position: center;
}
.grid .grid_item .item_data {
    padding-top: calc(var(--spaceY)*0.5);
}

/***THUMBS SLIDER***/
.flexible {
    display: flex;
    grid-gap: var(--gridGap);
    padding-inline: var(--spaceX);
    overflow-x: scroll;
}
.flexible .flex_item .item_media,
.flexible .grid_item .item_media {
    width: calc(var(--colWidth)*3 + var(--colGutter)*2);
}
.flexible .flex_item .item_media img,
.flexible .grid_item .item_media img {
    width: 100%;
    height: auto;
}
.flexible .browse-results-col,
.flexible .browse-results-col > form,
.flexible .browse-results-col [id^="browseResultsContainer"],
.flexible .grid {
    display: contents;
}
.flexible .browse-results-col ~ script,
.flexible .browse-results-col .load-more-wrapper,
.flexible .browse-results-col .page-load-status {
    display: none;
}
.flexible .grid_item {
    flex-shrink: 0;
    width: calc(var(--colWidth)*3 + var(--colGutter)*2);
}
/* 14-sep-2026 (user): la tarjeta de obra dentro del carrusel de un artista se ve igual que cualquier otra tarjeta
   de obra: el texto ajusta en varias lineas, sin recorte. (Antes: nowrap + overflow hidden, y el titulo se cortaba
   contra el borde de la imagen.) */
.flexible.dragging .grid_item {
    pointer-events: none;
}
/* EFC: flechas de carrusel con recuadro (malba las pone transparentes para SVG) */
section .section_header .header_actions .action_button.button_left,
section .section_header .header_actions .action_button.button_right {
    border-color: var(--textColor);
    padding: calc(var(--fontSizeXSmall)*0.35) calc(var(--fontSizeXSmall)*1) calc(var(--fontSizeXSmall)*0.25);
}
.flexible .item_data {
    padding-top: calc(var(--spaceY)*0.5);
}
#acquisitions .item_media,
#related .item_media {
    /* Se mantiene: es el fondo que se ve mientras carga la imagen, y en la
     * maqueta era el color del placeholder. */
    background: var(--paletteGray);
}

/* La maqueta ocultaba las imágenes de #acquisitions y #related con
 * `opacity: 0 !important` (maqueta-efc/style/default.css:884-889) para dejar
 * a la vista el rectángulo gris: en la maqueta estática no había imágenes
 * para esas dos secciones y el gris hacía de placeholder.
 *
 * Acá sí hay imágenes reales, así que la regla se saca. Dejaba las obras
 * como rectángulos grises con la proporción correcta y el `src` bien puesto
 * —se previsualizaban en las herramientas de desarrollo y no se veían en el
 * sitio—, que es un modo bastante desconcertante de fallar.
 *
 * Ojo con el `!important` y con que el selector incluía también `img.loaded`:
 * no era un fade-in a medio hacer, era deliberado. El fade-in de verdad es
 * `img.lazy` (más arriba en este mismo archivo). */

/***THUMBS TAGS***/
.flex_item .tags, 
.grid_item .tags {
    margin-top: var(--spaceY);
}

/***LIST***/
.list {
    position: relative;
    width: 100vw;
    flex-shrink: 0;
}
.list .list_header {
    display: grid;
    grid-template-columns: var(--gridTemplate);
    grid-gap: var(--gridGap);
    padding-block: calc(var(--spaceY) * 0.75);
}
.list .list_row {
    border-top: var(--borderLine);
    padding-block: calc(var(--spaceY)*0.75);
    /*
    display: grid;
    grid-template-columns: var(--gridTemplate);
    grid-gap: var(--gridGap);
    align-items: start;
    */
}
/*
.list .list_row:last-child {
    border-bottom: var(--borderLine);
}
*/
.list .list_row .row_link {
    grid-column: 1/13;
    display: grid;
    grid-template-columns: var(--gridTemplate);
    grid-gap: var(--gridGap);
}
.list_row .row_link .row_media {
    grid-column: 1/2;
}
.list_row .row_link .row_media img {
    width: 100%;
}
.list .list_header .header_title,
.list_row .row_link .row_title {
    grid-column: 4/7;
}
.list .list_header .header_location,
.list_row .row_link .row_location {
    grid-column: 7/10;
}
.list .list_header .header_date,
.list_row .row_link .row_date {
    grid-column: 10/12;
}
.list .list_header .header_count,
.list_row .row_link .row_count {
    grid-column: 12/13;
    text-align: right;
}


body#index .artwork_sheet {
    max-height: calc(100vh - var(--headerHeight));
}

/***ARTWORK SHEET***/
.artwork_sheet .sheet {
    display: grid;
    grid-template-columns: var(--gridTemplate);
    grid-gap: var(--gridGap);
    align-items: start;
    padding-inline: var(--spaceX);
}
body#index .artwork_sheet .sheet.dark {
    padding-block: calc(var(--spaceY)*2);
    color: var(--paletteWhite);
    background: var(--paletteBlack);
}
.sheet .sheet_data {
    grid-column: 1/7;
    height: 100%;
}
.sheet .sheet_data .data_main {
    display: flex;
    flex-direction: column;
    row-gap: var(--rowGutterMedium);
    justify-content: space-between;
    /*height: calc(100vh - var(--headerHeight) - var(--spaceY) - var(--headerHeightXSmall)*2);*/
    height: 100%;
}
body#artwork  .sheet .sheet_data .data_main {
    height: calc(100vh - var(--headerHeight) - var(--spaceY) - var(--headerHeightXSmall)*2);
}
body#index  .sheet .sheet_data .data_main {
    height: 100%;
}
body#artwork .sheet .sheet_data .data_main .main_header {
    position: sticky;
    top: var(--headerHeight);
    margin-bottom: calc(var(--tagHeight) + var(--rowGutterMedium));
}
.sheet .sheet_data .data_main .main_header .main_text {
        width: calc(var(--colWidth) * 4.5 + var(--colGutter) * 3.5);
}
.sheet .sheet_data .data_info {
     margin-top: calc(var(--headerHeightXSmall) + var(--spaceY));
}
.sheet_data .data_info .info_row:first-child {
    border-top: var(--borderLine);
}
.sheet_data .data_info .info_row {
    padding-block: calc(var(--spaceY)*0.6);
    border-bottom: var(--borderLine);  
}
.data_info .info_row .row_title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    cursor: pointer;
}
.info_row .row_title svg.plus_cross {
    height: var(--rowGutterXSmall);
    transform-origin: center;
    transition-property: transform;
    transition-duration: var(--transitionDurationSlow);
}
.info_row:not(.open) .row_title svg.plus_cross {
    transform: rotate(0deg);
}
.info_row.open .row_title svg.plus_cross {
    transform: rotate(45deg);
}
.info_row .row_title .plus_cross line {
    fill: none;
    stroke: var(--paletteBlack);
    stroke-width: 1px;
    stroke-linecap: butt;
    stroke-miterlimit: 10;
    vector-effect: non-scaling-stroke;
}
.data_info .info_row .row_content {
    display: grid;
    transition-property: padding-block, grid-template-rows, opacity;
    transition-duration: var(--transitionDurationSlow);
}
.data_info .info_row .row_content:not(.row_text) {
    padding-inline: calc(var(--colWidth)*2 + var(--colGutter)*2) var(--spaceX);
}
.data_info .info_row .row_content.row_text {
    padding-inline: 0 var(--spaceX);
}
.data_info .info_row:not(.open) .row_content {
    grid-template-rows: 0fr;
    padding-block: 0;
    opacity: 0;
}
.data_info .info_row.open .row_content {
    grid-template-rows: 1fr;
    padding-block: var(--spaceY);
    opacity: 1;
}
.data_info .info_row .row_content > .content_stack {
    overflow-y: hidden;
    display: flex;
    flex-direction: column;
    row-gap: var(--rowGutterXSmall);
}
.info_row .row_content > .content_stack .stack_item .item_label {
    line-height: var(--lineHeightNatural);
}

body#artwork .sheet .sheet_media {
    position: sticky;
    top: var(--headerHeight);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: calc(100vh - var(--headerHeight) - var(--spaceY) - var(--headerHeightXSmall) * 2);
}
.sheet .sheet_media {
    grid-column: 7/13;
}
/* La imagen de la ficha de obra ya NO cuelga directo de `.sheet_media`: desde
 * 2026-09-11 va dentro de `.media_marco`, que es quien se encoge al ancho real
 * de la imagen para que el pie de créditos quede alineado con ella. El marco y
 * su imagen los estila el theme malba, que este theme hereda; acá no hace
 * falta repetirlo.
 *
 * Esta regla queda comentada y no borrada porque documenta de dónde venía: era
 * la copia que trae la maqueta de EFC, con `object-fit: contain`, y cargando
 * DESPUÉS que la de malba le ganaba. Si algún día se vuelve al esquema
 * anterior, hay que acordarse de las dos copias.
 *
.sheet .sheet_media > img {
	(object-fit: contain sobre una caja del 100% del ancho)
}
*/
.sheet_media .media_footer {
    position: relative;
}
.sheet_media .media_footer .footer_actions {
    display: flex;
    justify-content: end;
    align-items: center;
    column-gap: var(--spaceX);
    margin-top: var(--spaceY);
    text-align: right;
}
.media_footer .footer_actions svg.plus_cross {
    height: var(--rowGutterXSmall);
    transform-origin: center;
    transition-property: transform;
    transition-duration: var(--transitionDurationSlow);
}
.media_footer .footer_actions svg.plus_cross line {
    fill: none;
    stroke: var(--paletteBlack);
    stroke-width: 1px;
    stroke-linecap: butt;
    stroke-miterlimit: 10;
    vector-effect: non-scaling-stroke;
}
.media_footer .credits {
    position: absolute;
    top: calc((var(--fontSizeXSmall) + var(--rowGutterXSmall)) * -1);
    right: 0;
    width: 100%;
    padding: var(--fontSizeXSmall) 0 var(--fontSizeXSmall) var(--fontSizeXSmall);
    text-align: right;
    background: var(--paletteWhite);
}

.artwork_text {
    display: grid;
    grid-template-columns: var(--gridTemplate);
    grid-gap: var(--gridGap);
    align-items: start;
    padding-inline: var(--spaceX);
}
.artwork_text .text {
    grid-column: 1/7;
    /*
    column-count: 2;
    column-gap: var(--colGutter);
    */
}

/***TAGS***/
.tags {
    display: flex;
    flex-wrap: wrap;
    justify-content: start;
    align-items: start;
    gap: calc(var(--spaceY)*0.5) calc(var(--colGutter)*0.75);
}
.tags .tag_button {
    border: 1px solid var(--textColor);
    padding: calc(var(--fontSizeXSmall)*0.6) calc(var(--fontSizeXSmall)*1) calc(var(--fontSizeXSmall)*0.5);
    background: var(--paletteWhite);
    border-radius: 2px;
    cursor: pointer;
    transition-property: color, background;
    transition-duration: var(--transitionDuration);
}
.tags .tag_button:hover {
    color: var(--paletteWhite);
    background: var(--paletteBlack);
    border-radius: 3px;
}
.dark .tags .tag_button {
    border: 1px solid var(--paletteWhite);
    color: var(--paletteWhite);
    background: transparent;
}
.dark .tags .tag_button:hover {
    color: var(--paletteBlack);
    background: var(--paletteWhite);
    border-radius: 3px;
}

/***TIMELINE***/
section.timeline .content_title {
    padding-inline: var(--spaceX);
}
.timeline_slider {
    margin-top: var(--headerHeight);
    grid-column: 1/13;
}


/***FOOTER***/
footer {
    width: 100%;
    min-height: var(--footerHeight);
    padding-inline: var(--spaceX);
    color: var(--paletteWhite);
    background: var(--paletteBlack);
}
footer a {
    color: var(--paletteWhite);
}
footer .footer_content {
    padding-block: var(--spaceY) calc(var(--spaceY)*3);
    display: grid;
    grid-template-columns: var(--gridTemplate);
    grid-gap: var(--gridGap);
    border-top: var(--borderLine);
}
footer .footer_menu {
    grid-column: 1/4;
}
footer .footer_sub_menu {
    grid-column: 4/7;
}
footer .footer_info_menu {
    grid-column: 7/10;
}
footer .footer_credits_menu {
    grid-column: 10/13;
    text-align: right;
}
footer nav ul,
footer nav ul li.menu_item {
    display: block;
}
footer nav ul li.menu_item.search_footer_button {
    cursor: pointer;
}
footer nav ul li.menu_item.search_footer_button:hover {
    color: var(--paletteGray);
}
footer .footer_data {
    grid-column: 1/7;
    display: flex;
    column-gap: var(--colGutter);
}
footer .footer_data .data_item {
    width: calc(var(--colWidth) * 3 + var(--colGutter) * 2);
}

/***INFO
*****************************************************/
body#info {
    color: var(--paletteWhite);
    background: var(--paletteBlack);
}
body#info header {
    background: var(--paletteBlack);
}
body#info a {
    color: var(--paletteWhite);
}

/* ─── responsive.css de la maqueta ─────────────────────────────────── */
/***DESKTOPS (X-LARGE SCREEN)
*****************************************************/
@media (min-width: 1920px) {  
}

/***DESKTOPS (LARGE SCREEN)
*****************************************************/
@media (min-width: 1600px) {
}

/***NOTEBOOKS (MEDIUM SCREEN)
*****************************************************/
@media (min-width: 1024px) and (max-width: 1599px) {
}

/***FROM TABLETS TO MOBILES
*****************************************************/
@media (max-width: 1023px) {
    :root {
        /***VIEWPORT HEIGHT***/
        --viewportHeight: calc(var(--vh, 1vh) * 100);
    }
    body {
        height: 100vh; /* Fallback */
        height: var(--viewportHeight);
    }
}

/***TABLETS, MOBILES (LANDSCAPE)
*****************************************************/
@media (min-width: 481px) and (max-width: 1023px) {
    :root {
        --fontSizeXSmall: 0.9rem;
        --fontSizeSmall: 0.9rem;
        --fontSizeMedium: 1.2rem;
        --fontSizeLarge: 2.5rem;
        --fontSizeXLarge: 2.5rem;
        --fontSizeLogo: 1rem;
        --spaceX: calc(var(--fontSizeSmall) * var(--lineHeightHigh));
        --spaceY: calc(var(--fontSizeSmall) * var(--lineHeightHigh));
        --colGutter: calc(var(--spaceX) * 0.5);
        --headerHeight: calc(var(--spaceY)*1 + var(--rowGutterMedium));
    }
    header {
        padding: calc(var(--spaceY)*0.5) var(--spaceX);
    }
    #intro_text .text p {
        grid-column: 1 / 13;
    }
    .flexible .flex_item .item_media {
        width: calc(var(--colWidth) * 5 + var(--colGutter) * 4);
    }
    .search {
        padding-block: calc(var(--spaceY)*0.5);
    }
    section .section_header .header_actions {
        width: calc(var(--colWidth) * 7 + var(--colGutter) * 6);
    }
    .sheet .sheet_data .data_main .main_header .main_text {
        display: none;
    }
    .data_info .info_row .row_content:not(.row_text) {
        padding-inline: 0px;
    }
}

@media (min-width: 481px) {
    .sheet_media_mobile {
        display: none;
    }
    header .menu_button_button {
        display: none;
    }
    .menu_mobile {
        display: none;
    }
}

/***MOBILES (PORTRAIT)
*****************************************************/
@media (max-width: 480px) {
    html:root {
        --fontSizeXSmall: 1rem;
        --fontSizeSmall: 1rem;
        --fontSizeMedium: 1.3rem;
        --fontSizeLarge: 1.9rem;
        --fontSizeXLarge: 2.5rem;
        --spaceX: calc(var(--fontSizeSmall) * var(--lineHeightHigh));
        --spaceY: calc(var(--fontSizeSmall) * var(--lineHeightHigh));
        --colGutter: calc(var(--spaceX) * 0.5);
        --headerHeight: calc(var(--spaceY)*2 + var(--fontSizeSmall));
    }
    body.scroll_less {
        overflow: hidden;
    }
    header .site_name {
        font-size: var(--fontSizeMedium);
    }
    header .header_menu {
        display: none;
    }
    header .menu_button_button {
        display: block;
    }
    header .menu_button_button svg.burger_icon {
        width: auto;
        height: var(--fontSizeXSmall);
        margin-top: 1px;
        fill: none;
        stroke: var(--textColor);
        stroke-width: 2px;
        stroke-linecap: butt;
        transition-property: stroke;
        transition-duration: var(--transitionDurationSlow);
    }
    nav.menu_mobile {
        position: fixed;
        top: var(--headerHeight);
        left: 0px;
        z-index: 300;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        gap: var(--rowGutterLarge) var(--colGutter);
        width: 100vw;
        height: calc(100vh - var(--headerHeight));
        padding: var(--mainTopSpace) var(--spaceX) calc(var(--spaceY) * 3);
        background: var(--paletteBlack);
        transition-property: opacity;
        transition-duration: var(--transitionDurationSlow);
    }
    .menu_mobile:not(.on) {
        opacity: 0;
        pointer-events: none;
    }
    .menu_mobile.on {
        opacity: 1;
        pointer-events: auto;
    }
    .menu_mobile svg.plus_cross {
        height: var(--rowGutterXSmall);
        position: absolute;
        top: 0;
        right: 0;
        margin: calc(var(--spaceY) * -1.9) calc(var(--spaceX) * 0.9);
        transform: rotate(45deg);
        transform-origin: center;
        transition-property: transform;
        transition-duration: var(--transitionDurationSlow);
        pointer-events: auto;
        cursor: pointer;
    }
    .menu_mobile .plus_cross line {
        fill: none;
        stroke: var(--paletteWhite);
        stroke-width: 1px;
        stroke-linecap: butt;
        stroke-miterlimit: 10;
        vector-effect: non-scaling-stroke;
    }
    .menu_mobile ul {
        width: calc(100vw - var(--spaceX) * 2);
        padding-bottom: calc(var(--spaceY) * 0.25);
    }
    .menu_mobile ul li {
        display: block;
    }
    .menu_mobile a {
        color: var(--paletteWhite);
    }
    .menu_mobile .search_form {
        position: relative;
        border-bottom: 1px solid var(--paletteWhite);
    }
    .menu_mobile input,
    .menu_mobile input::placeholder {
        color: var(--paletteWhite);
    }
    .menu_mobile .action_button {
        position: absolute;
        right: 0;
        bottom: calc(var(--spaceY)*0.5);
    }
    .menu_mobile .action_button .button_icon {
        margin-right: calc(var(--latinxTextSmall) * 0.5);
        align-self: center;
        width: calc(var(--fontSizeLarge) * 0.75);
        height: calc(var(--fontSizeLarge) * 0.75);
        fill: none;
        stroke: var(--paletteWhite);
        stroke-width: 2px;
        stroke-linecap: butt;
    }
    section .section_header .header_actions .action_button {
        color: var(--textColor);
        background: var(--paletteWhite);
    }
    section .section_header .header_actions .action_button.button_right,
    section .section_header .header_actions .action_button.button_left {
        display: none;
    }
    section .section_header {
        align-items: center;
    }
    #intro_text .text p {
        grid-column: 1 / 13;
        column-count: 1;
        column-gap: var(--colGutter);
    }
    .flexible .flex_item .item_media,
    .flexible .grid_item .item_media {
        width: calc(var(--colWidth) * 10 + var(--colGutter) * 9);
    }
    .flexible .grid_item {
        width: calc(var(--colWidth) * 10 + var(--colGutter) * 9);
    }
    .grid .grid_item {
        grid-column: span 6;
    }
    .list_row .row_link .row_media {
        grid-column: 1 / 7;
    }
    .list_row .row_link .row_title {
        grid-column: 7 / 13;
    }
    .list .list_header,
    .list_row .row_link .row_location,
    .list_row .row_link .row_date,
    .list_row .row_link .row_count {
        display: none;
    }
    .artwork_sheet .sheet {
        display: inline-block;
    }
    body#artwork .sheet .sheet_media {
        display: none;
    }
    body#artwork .sheet .sheet_data .data_main {
        height: auto;
    }
    body#artwork .sheet .sheet_data .data_main .main_header {
        position: static;
        margin-bottom: 0px;
    }
    .sheet_media_mobile,
    .sheet_media_mobile img {
        width: 100%;
    }
    .media_mobile_credits span {
        display: inline-block;
        margin-top: calc(var(--rowGutterSmall)*0.5);
    }
    .media_footer .footer_actions svg.plus_cross {
        display: none;
    }
    .sheet_media .media_footer .footer_actions {
        justify-content: center;
    }
    .artwork_text .text {
        grid-column: 1 / 13;
    }
    .data_info .info_row .row_content.row_text {
        padding: 0;
    }
    .header_title.font_style_bold.font_size_small {
        font-size: var(--fontSizeSmall);
    }
    .about_text .section_content .content_title {
        position: static;
        grid-column: 1 / 13;
    }
    .about_text .section_content .content_text,
    .about_text .section_content .content_stack {
        grid-column: 1 / 13;
    }
    .about_text .section_content {
        grid-gap: calc(var(--rowGutterMedium)*1) var(--colGutter);
    }
    .content_stack .stack_item .stack_media {
        flex-wrap: wrap;
    }
    .content_stack .stack_media .media_item {
        margin-top: var(--rowGutterMedium);
        width: calc(var(--colWidth)*6 + var(--colGutter)*5);
    }
    .content_stack .stack_item .stack_media {
        display: flex;
        grid-gap: calc(var(--rowGutterSmall)*1) var(--colGutter);
    }
    footer .footer_content {
        grid-gap: calc(var(--rowGutterSmall)*2) var(--colGutter);
    }
    footer .footer_menu {
        grid-column: 1 / 7;
    }
    footer .footer_sub_menu {
        grid-column: 7 / 13;
    }
    footer .footer_info_menu,
    footer .footer_credits_menu {
        grid-column: 1 / 13;
    }
    footer .footer_credits_menu {
        text-align: left;
    }
}
/* ─── Neutralizar la tipografía heredada de malba ──────────────────────────
   La maqueta de EFC pone la fuente en `body` y NO define las clases
   `font_style_*`, aunque el markup las use: con una sola familia alcanza.
   Pero el theme malba sí las define (`.font_style_regular` → Latinx…), y una
   clase (0,1,0) le gana a un selector de elemento (0,0,1) por más que este
   archivo cargue después. Resultado: todo salía en Latinx.

   Se redeclaran acá apuntando a Garamond. La cursiva es la única variante que
   existe en esta identidad; negrita y black usan la misma familia, como en la
   maqueta. */
.font_style_regular,
.font_style_bold,
.font_style_black,
.font_style_medium {
    font-family: var(--GaramondRegular);
}
.font_style_regular_oblique,
.font_style_bold_oblique {
    font-family: var(--GaramondRegularItalic);
}

/* ─── El desplazamiento al abrir los filtros, una sola vez ─────────────────
   La maqueta corre `.grid` / `.list` cuando se abren los filtros, porque ahí
   esos elementos son los hijos directos de `.filterable`. En Pawtucket hay un
   contenedor de por medio (`.browse-results-col > form > #browseResultsContainer`),
   así que el theme malba aplica el corrimiento en `.browse-results-col` — con
   un comentario que lo explica en su custom.css.

   Como este archivo carga DESPUÉS del de malba, las dos reglas se sumaban y el
   listado se corría el doble: medido, la grilla quedaba en x = -687 en vez de
   -344, con el hueco a la derecha del doble de ancho.

   Acá se anula el corrimiento sobre .grid/.list y queda solo el del contenedor.
   `.filters` no se toca: esa parte de la regla sí es correcta y coincide con
   lo que hace malba. */
.filterable:not(.filters_on) .grid,
.filterable:not(.filters_on) .list,
.filterable.filters_on .grid,
.filterable.filters_on .list {
    right: auto;
    overflow: visible;
}

/***TIMELINE / CONTENT STACK (línea de tiempo de la colección)
*****************************************************/
.about_text .section_content .content_stack {
    grid-column: 7/13;
}
.about_text .section_content .content_stack .stack_item:not(:last-child) {
    padding-bottom: calc(var(--mainTopSpace) + var(--spaceY));
}
.about_text .section_content .content_stack .stack_item:not(:first-child) {
    padding-top: calc(var(--spaceY)*1);
    border-top: var(--borderWidth) solid var(--paletteBlack);
}
.content_stack .stack_item .stack_title {
    margin-bottom: var(--rowGutterMedium);
}
.content_stack .stack_item .stack_media {
    display: flex;
    grid-gap: var(--gridGap);
}
.content_stack .stack_media .media_item {
    margin-top: var(--rowGutterMedium);
    width: calc(var(--colWidth)*2 + var(--colGutter));
}
.stack_media .media_item .item_source,
.stack_media .media_item .item_source img {
    width: 100%;
}
.stack_media .media_item .item_data {
    margin-top: calc(var(--spaceY)*0.5);
    width: 100%;
}
.stack_media .media_item a {
    color: inherit;
    text-decoration: none;
}
@media (max-width: 480px) {
    .about_text .section_content .content_stack {
        grid-column: 1 / -1;
    }
    .content_stack .stack_item .stack_media {
        flex-wrap: wrap;
        width: 80%;
        margin: 3.4rem 0 1rem;
        gap: 2rem;
    }
    .content_stack .stack_media .media_item {
        width: 100%;
        margin: 0;
    }
}
