/* =========================================================
   VIEJO MAESTRO · /FRASES
   Archivo visual 3 x 3 + sidebar derecho
========================================================= */

.page-phrase-archive .phrase-archive-section{
  padding-top:46px;
  padding-bottom:72px;
}

/*
 * Desktop:
 * área principal amplia + sidebar derecho fijo.
 */
.page-phrase-archive .phrase-archive-layout{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 310px !important;
  gap:48px !important;
  align-items:start !important;
  width:100%;
}

.page-phrase-archive .phrase-archive-main{
  min-width:0;
  width:100%;
}

/*
 * Siempre 3 columnas en desktop.
 * Si sólo existe una imagen, ocupa UNA celda,
 * no todo el ancho disponible.
 */
.page-phrase-archive .phrase-image-grid{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:18px !important;
  width:100%;
  align-items:start;
}

.page-phrase-archive .phrase-image-card{
  display:block;
  width:100% !important;
  min-width:0;
  max-width:none !important;
  margin:0 !important;
  padding:0;
  overflow:hidden;
  background:#eee8df;
}

.page-phrase-archive .phrase-image-card img{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  aspect-ratio:7 / 9;
  object-fit:cover;
}

/*
 * Sidebar permanece a la derecha en escritorio
 * y no toma el ancho completo.
 */
.page-phrase-archive .phrase-archive-sidebar{
  display:block !important;
  min-width:0;
  width:310px !important;
  max-width:310px !important;
  margin:0 !important;
}

/* Un poco de aire entre módulos del sidebar. */
.page-phrase-archive .phrase-archive-sidebar .sidebar-module + .sidebar-module{
  margin-top:34px;
}

/*
 * La paginación conserva las clases globales existentes:
 * section-pagination, pagination-nav, pagination-page, etc.
 */


/* =========================================================
   TABLET
========================================================= */

@media(max-width:1000px){

  .page-phrase-archive .phrase-archive-layout{
    grid-template-columns:minmax(0,1fr) 260px !important;
    gap:30px !important;
  }

  .page-phrase-archive .phrase-archive-sidebar{
    width:260px !important;
    max-width:260px !important;
  }

  .page-phrase-archive .phrase-image-grid{
    gap:14px !important;
  }

}


/* =========================================================
   MOBILE
   Recién acá el sidebar pasa debajo.
========================================================= */

@media(max-width:720px){

  .page-phrase-archive .phrase-archive-layout{
    grid-template-columns:1fr !important;
    gap:38px !important;
  }

  .page-phrase-archive .phrase-archive-sidebar{
    width:100% !important;
    max-width:none !important;
  }

  .page-phrase-archive .phrase-image-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

}


@media(max-width:480px){

  .page-phrase-archive .phrase-archive-section{
    padding-top:30px;
    padding-bottom:52px;
  }

  .page-phrase-archive .phrase-image-grid{
    grid-template-columns:1fr !important;
    gap:18px !important;
  }

}