@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('fonts/roboto-300-latin-v1.woff2') format('woff2');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('fonts/roboto-700-latin-v1.woff2') format('woff2');
}
.a-art { background: var(--paper); }
.a-grid {
  display: grid;
  max-width: 1224px;
  margin: 0 auto;
  grid-template-columns: var(--cols);
  grid-template-rows: var(--rows);
  min-height: var(--minh, auto);
}
.a-b { grid-row: var(--r); grid-column: var(--c); align-self: var(--al, stretch); justify-self: var(--ju, stretch); min-width: 0; z-index: var(--z, auto); }
.a-txt { white-space: break-spaces; overflow-wrap: break-word; color: var(--ink); }
.a-t {
  margin: 0 0 var(--mb, 0);
  font-family: var(--font-body);
  font-size: var(--fs);
  line-height: var(--lh);
  font-weight: var(--fw, 400);
}
.a-t:empty { height: var(--lh); }
.a-t a { color: inherit; }
.a-sd { font-size: var(--sd); }
.a-ul { margin: 0 0 var(--mb, 0); padding: 0 0 0 40px; list-style: disc; font-size: 16px; color: var(--ink); }
.a-ul p { margin: 0; font-size: var(--fs); line-height: var(--lh); }
.a-ul p:empty { height: var(--lh); }
.a-img { width: 100%; height: var(--h); overflow: hidden; }
.a-img img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, 50% 50%); }
.a-contacto { background: var(--paper); padding: 0 0 54px; display: flex; justify-content: center; }
.a-contacto .btn { padding: 8.5px 55.5px; font-size: 18px; line-height: 30.96px; }
.b-cab { background: var(--paper); padding: 64px 28px 62px; text-align: center; }
.b-cab h1 { margin: 0; font-family: var(--font-body); font-weight: var(--weight-regular); font-size: 32px; line-height: 41.6px; color: var(--brand); }
.b-cab p { margin: 14.4px 0 0; font-size: 24px; line-height: 31.2px; font-weight: var(--weight-regular); color: var(--ink); text-align: left; }
.b-lista { --b-negro: #000000; --b-activo: #673de6; background: var(--paper); padding: 80px 0 92px; }
.b-grid {
  list-style: none;
  margin: 0 auto;
  padding: 0;
  width: calc(100% - 92px);
  max-width: 1188px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: 79.5px;
  row-gap: 80px;
}
.b-grid li[hidden] { display: none; }
.b-card { display: block; color: var(--b-negro); text-decoration: none; }
.b-card:hover { text-decoration: none; }
.b-card__foto { display: block; aspect-ratio: 343 / 206; overflow: hidden; }
.b-card__foto img { display: block; width: 100%; height: 100%; object-fit: cover; }
.b-card h3 { margin: 20px 0 0; font-family: var(--font-body); font-weight: 700; font-size: 20px; line-height: 26px; color: var(--b-negro); }
.b-card__bajada { margin: 12px 0 0; font-size: 16px; line-height: 20.8px; font-weight: 400; color: var(--b-negro); }
.b-card__autor { margin: 11px 0 0; font-size: 16px; line-height: 20.8px; color: var(--b-negro); }
.b-card__fecha { margin: 4px 0 0; font-size: 16px; line-height: 20.8px; color: var(--b-negro); }
.b-pag { display: flex; justify-content: center; align-items: center; gap: 12px; margin-top: 1.4px; padding-right: 12px; }
.b-pag[hidden] { display: none; }
.b-pag button {
  min-width: 24px;
  height: 24px;
  padding: 0 4px;
  border: 0;
  background: none;
  font-family: var(--font-body);
  font-size: 12px;
  color: var(--b-negro);
  cursor: pointer;
}
.b-pag button[aria-current="page"] { color: var(--b-activo); }
.b-pag button:disabled { cursor: default; }
.b-pag svg { width: 20px; height: 20px; display: block; }
@media (max-width: 920px) {
  .a-grid {
    max-width: 360px;
    padding: 0 16px;
    grid-template-columns: 100%;
    grid-template-rows: var(--trows);
    min-height: var(--tminh, auto);
  }
  .a-b { grid-row: var(--rm); grid-column: var(--cm); align-self: var(--alm, stretch); justify-self: var(--jum, stretch); }
  .a-t { font-size: var(--fsm); line-height: var(--lhm); margin-bottom: var(--mbm, 0); }
  .a-t:empty { height: var(--lhm); }
  .a-sd { font-size: var(--sdm, inherit); }
  .a-ul { margin-bottom: var(--mbm, 0); line-height: 1.5; }
  .a-ul p { font-size: var(--fsm); line-height: var(--lhm); }
  .a-ul p:empty { height: var(--lhm); }
  .a-img { height: var(--hm); }
  .a-img img { object-position: var(--posm, var(--pos, 50% 50%)); }
  .a-contacto { padding: 0 0 110px; }
  .a-contacto .btn { padding: 8.5px 46.7px; font-size: 14px; }
  .b-cab { padding: 64px 31px 88px; }
  .b-cab p { margin-top: 17px; text-align: center; }
  .b-grid { width: auto; max-width: 358px; grid-template-columns: 1fr; row-gap: 80px; }
  .b-card__foto { aspect-ratio: 358 / 215; }
  .b-pag { margin-top: 4.6px; }
}