.infografia-grid {
display: grid;
grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr));
gap: 24px; } @media (max-width: 1024px) {
.infografia-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
.infografia-grid { grid-template-columns: 1fr; }
} .fq-infografia-card { width: 100%; box-sizing: border-box; } .fq-infografia-card {
position: relative;
border: 1px solid #D4D4D4; padding: 20px; background: #FFFFFF;
font-family: 'TT Norms Pro', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
transition: border-color .2s ease, box-shadow .2s ease;
} .fq-infografia-card:hover {
border-color: #3332CB;
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
} .fq-infografia-card__link {
display: block;
text-decoration: none;
color: inherit;
} .fq-infografia-card__link--disabled {
cursor: default;
} .fq-infografia-card .infografia-thumb {
display: block;
margin-bottom: 16px; }
.fq-infografia-card .infografia-thumb .infografia-img,
.fq-infografia-card .infografia-thumb img {
display: block;
width: 100%; height: 430px; border: 1px solid #D4D4D4; object-fit: cover;
object-position: center;
}
.fq-infografia-card .thumb-fallback {
width: 100%;
height: 430px;
background: #EEE;
border: 1px solid #D4D4D4;
display: flex;
align-items: center;
justify-content: center;
color: #999;
font-size: 0.875rem;
} .fq-infografia-card .infografia-content {
position: relative;
} .fq-infografia-card .infografia-yearbox-container {
display: flex;
justify-content: flex-start;
margin-bottom: 10px; }
.fq-infografia-card .infografia-yearbox {
display: inline-flex;
align-items: center;
height: 30px; padding: 0 10px; background: #F5F5F5; font-size: 0.875rem; font-weight: 400; color: #525252; font-family: 'TT Norms Pro', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
} .fq-infografia-card .infografia-title {
margin: 0 0 10px 0; font-size: 1.25rem; font-weight: 500; color: #1B1C1D; line-height: 1.4;
font-family: 'TT Norms Pro', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
} .fq-infografia-card__link:hover .infografia-title {
text-decoration: underline;
} .fq-infografia-card .infografia-grupo {
margin-bottom: 10px; }
.fq-infografia-card .grupo-badge {
display: inline-flex;
align-items: center;
padding: 6px 0; font-size: 0.875rem; font-weight: 500; color: #3332CB; background: transparent;  text-decoration: none;
font-family: 'TT Norms Pro', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
} .fq-infografia-card .infografia-linea { }
.fq-infografia-card .linea-pill {
display: inline-flex;
align-items: center;
gap: 6px; padding: 4px 10px; background: #F5F5F5; text-decoration: none;
font-family: 'TT Norms Pro', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}
.fq-infografia-card .linea-icon {
display: inline-flex;
line-height: 0;
}
.fq-infografia-card .linea-name {
font-size: 0.875rem; font-weight: 400; color: #525252; } .fq-infografia-card a {
text-decoration: none;
color: inherit;
} @media (max-width: 640px){
.fq-infografia-card{ padding:16px; } .fq-infografia-card__link{
display:grid;
grid-template-columns: 80px 1fr; grid-template-rows: auto auto; column-gap:16px;
row-gap:10px;
grid-template-areas:
"image meta"
"taxos taxos";
} .fq-infografia-card .infografia-thumb{ grid-area:image; margin:0; }
.fq-infografia-card .infografia-meta{  grid-area:meta;  display:flex; flex-direction:column; min-width:0; }
.fq-infografia-card .infografia-taxos{ grid-area:taxos; } .fq-infografia-card .infografia-thumb .infografia-img,
.fq-infografia-card .infografia-thumb img,
.fq-infografia-card .thumb-fallback{
width:80px; height:100px; min-width:80px; min-height:100px;
object-fit:cover; object-position:center;
border:1px solid #D4D4D4;
} .fq-infografia-card .infografia-yearbox-container{ margin:0 0 6px 0; }
.fq-infografia-card .infografia-yearbox{ height:auto; padding:4px 8px; }
.fq-infografia-card .infografia-yearbox__text{ font-size:.75rem; } .fq-infografia-card .infografia-title{
font-size:1.125rem; line-height:1.35; margin:0;
} .fq-infografia-card .infografia-grupo{ margin:6px 0; }
.fq-infografia-card .grupo-badge{
font-size:.75rem; padding:4px 8px;
}
.fq-infografia-card .linea-pill{ padding:2px 8px; }
.fq-infografia-card .linea-name{ font-size:.813rem; }
}