article figure p {
  text-align: center;
  color: var(--dark);
  width: 100%;
  font-size: small;
}

/* desktop specifics */
@media (min-width: 72em) {
  #release-quote {
    min-width: calc(50% - 2.1em);
    padding-top: 0;
    margin: 1em 1em 0 3em;
    flex: 0;
    order: 2;
  }

  #release-quote > blockquote {
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    height: var(--half-article-height);
  }

  /*************/
  /* EDITORIAL */
  /*************/

  section.editorial {
    /* display: inline-block; */
    min-width: calc(50% - 2.1em);
    flex: 0;
    order: 1;
  }

  article.editorial {
    height: var(--half-article-height);
  }

  article.editorial figure,
  article.editorial > div {
    width: 50%;
    height: 100%;
    float: left;
  }

  /**********************/
  /* DOSSIER/SUPLEMENTO */
  /**********************/

  article.supplemento:nth-of-type(1) > div,

  article.dossier:nth-of-type(1) > div {
    height: var(--half-article-height);
  }

  article.suplemento:nth-of-type(1) figure,

  article.dossier:nth-of-type(1) figure {
    width: 100% !important;
  }

  article.suplemento:nth-of-type(2),

  article.dossier:nth-of-type(2) {
    width: calc(60% - 2em) !important;
  }

  article.suplemento:nth-of-type(2) > div,

  article.dossier:nth-of-type(2) > div {
    width: 40% !important;
  }

  article.suplemento:nth-of-type(2) figure,

  article.dossier:nth-of-type(2) figure {
    height: 100% !important;
    float: left !important;
    width: 60% !important;
  }

  /*
   * multiples of 4n are hard to set given the flow of the html
   * these are the small ones:
   *
   * |-----------------------------------------------|
   * |     4n + 3      |                  |          |
   * |-----------------|      4n + 1      |  4n + 2  |
   * |        4n       |                  |          |
   * |-----------------------------------------------|
   */

  article.suplemento:nth-of-type(4n),

  article.dossier:nth-of-type(4n) {
    position: relative;
    margin-left: calc(-1 * calc(40% - 2em) - 0.9em);
    margin-top: 15em;
  }

  article.suplemento:nth-of-type(4n),
  article.suplemento:nth-of-type(4n+1),
  article.suplemento:nth-of-type(4n+3),

  article.dossier:nth-of-type(4n),
  article.dossier:nth-of-type(4n+1),
  article.dossier:nth-of-type(4n+3) {
    width: calc(40% - 2.3em);
  }

  article.suplemento:nth-of-type(4n+1) > div,
  article.dossier:nth-of-type(4n+1) > div {
    width: 100%;
    height: calc(var(--half-article-height) - 1em);
  }

  article.suplemento:nth-of-type(4n),
  article.suplemento:nth-of-type(4n+3),

  article.dossier:nth-of-type(4n),
  article.dossier:nth-of-type(4n+3) {
    height: var(--half-article-height);
  }

  article.suplemento:nth-of-type(4n+2),
  article.dossier:nth-of-type(4n+2) {
    width: calc(20% - 2em);
  }

  article.suplemento:nth-of-type(4n) > div,
  article.suplemento:nth-of-type(4n+3) > div,

  article.dossier:nth-of-type(4n) > div,
  article.dossier:nth-of-type(4n+3) > div {
    width: 70%;
  }

  article.suplemento:nth-of-type(4n) figure,
  article.suplemento:nth-of-type(4n+3) figure,

  article.dossier:nth-of-type(4n) figure,
  article.dossier:nth-of-type(4n+3) figure {
    width: 30%;
    float: left;
    height: 100%;
  }

  article.suplemento:nth-of-type(4n+1) figure,
  article.suplemento:nth-of-type(4n+2) figure,

  article.dossier:nth-of-type(4n+1) figure,
  article.dossier:nth-of-type(4n+2) figure {
    width: 100%;
    height: calc(var(--half-article-height) + 2em);
  }

  /* If the last row has only 3 articles */

  /*
   * |------------------------------------|
   * |           |            |           |
   * |  last(3)  |   last(2)  |  last(1)  |
   * |           |            |           |
   * |------------------------------------|
   */

  article.suplemento:nth-of-type(4n+3):nth-last-child(3),
  article.suplemento:nth-of-type(4n):nth-last-child(2),
  article.suplemento:nth-of-type(4n+1):nth-last-child(1), /* intentionally unfinished... */

  article.suplemento:nth-of-type(4n+3):nth-last-child(2),
  article.suplemento:nth-of-type(4n):nth-last-child(1),

  article.dossier:nth-of-type(4n+3):nth-last-child(3),
  article.dossier:nth-of-type(4n):nth-last-child(2),
  article.dossier:nth-of-type(4n+1):nth-last-child(1), /* intentionally unfinished... */

  article.dossier:nth-of-type(4n+3):nth-last-child(2),
  article.dossier:nth-of-type(4n):nth-last-child(1),

  /* If the last row has only 1 article, we treat the last two rows as 3 + 2 */

  /*
   * |-----------------------------------|
   * |           |           |           |
   * |  last(5)  |  last(4)  |  last(3)  |
   * |           |           |           |
   * |-----------------------------------|
   * |                |                  |
   * |    last(2)     |     last(1)      |
   * |                |                  |
   * |-----------------------------------|
   */

  article.suplemento:nth-of-type(4n+3):nth-last-child(5),
  article.suplemento:nth-of-type(4n):nth-last-child(4),
  article.suplemento:nth-of-type(4n+1):nth-last-child(3),

  article.dossier:nth-of-type(4n+3):nth-last-child(5),
  article.dossier:nth-of-type(4n):nth-last-child(4),
  article.dossier:nth-of-type(4n+1):nth-last-child(3) {
    position: relative;
    width: calc(33% - 1.99em);
    height: var(--article-height);
    margin: 1em;
  }

  article.suplemento:nth-of-type(4n+2):nth-last-child(2),
  article.suplemento:nth-of-type(4n+3):nth-last-child(1),

  article.dossier:nth-of-type(4n+2):nth-last-child(2),
  article.dossier:nth-of-type(4n+3):nth-last-child(1), /* intentionally unfinished... */

  /* ...and if the last row has only 2 articles */
  article.suplemento:nth-of-type(4n+3):nth-last-child(2),
  article.suplemento:nth-of-type(4n):nth-last-child(1),
  article.dossier:nth-of-type(4n+3):nth-last-child(2),
  article.dossier:nth-of-type(4n):nth-last-child(1) {
    position: static;
    width: calc(50% - 2.2em);
    height: var(--article-height);
  }

  /* the figures on the cases above: */

  article.suplemento:nth-of-type(4n+3):nth-last-child(5) figure,
  article.suplemento:nth-of-type(4n):nth-last-child(4) figure,
  article.suplemento:nth-of-type(4n+1):nth-last-child(3) figure,

  article.suplemento:nth-of-type(4n+3):nth-last-child(2) figure,
  article.suplemento:nth-of-type(4n):nth-last-child(1) figure,

  article.suplemento:nth-of-type(4n+3):nth-last-child(3) figure,
  article.suplemento:nth-of-type(4n):nth-last-child(2) figure,
  article.suplemento:nth-of-type(4n+1):nth-last-child(1) figure,

  article.dossier:nth-of-type(4n+3):nth-last-child(5) figure,
  article.dossier:nth-of-type(4n):nth-last-child(4) figure,
  article.dossier:nth-of-type(4n+1):nth-last-child(3) figure,

  article.dossier:nth-of-type(4n+3):nth-last-child(2) figure,
  article.dossier:nth-of-type(4n):nth-last-child(1) figure,

  article.dossier:nth-of-type(4n+3):nth-last-child(3) figure,
  article.dossier:nth-of-type(4n):nth-last-child(2) figure,
  article.dossier:nth-of-type(4n+1):nth-last-child(1) figure {
    width: 100%;
    height: var(--half-article-height);
  }

  article.suplemento:nth-of-type(4n+2):nth-last-child(2) figure,
  article.suplemento:nth-of-type(4n+3):nth-last-child(1) figure,

  article.dossier:nth-of-type(4n+2):nth-last-child(2) figure,
  article.dossier:nth-of-type(4n+3):nth-last-child(1) figure {
    width: 100%;
    height: var(--half-article-height);
    float: unset;
  }

  /***********************/
  /* PANÓPTICO & CRÍTICA */
  /***********************/

  article.crítica,
  article.panóptico {
    width: calc(50% - 2.15em);
  }

  article.crítica figure,
  article.panóptico figure {
    width: 100%;
    height: calc(var(--half-article-height) + 1em);
  }

  article.crítica:nth-of-type(3):nth-last-child(3),
  article.crítica:nth-of-type(4):nth-last-child(2),
  article.crítica:nth-of-type(5):nth-last-child(1),
  article.panóptico:nth-of-type(3):nth-last-child(3),
  article.panóptico:nth-of-type(4):nth-last-child(2),
  article.panóptico:nth-of-type(5):nth-last-child(1) {
    width: calc(33% - 1.99em);
  }

  article.crítica:nth-of-type(3n+1):nth-last-child(3n),
  article.crítica:nth-of-type(3n+2):nth-last-child(3n+2),
  article.crítica:nth-of-type(3n):nth-last-child(3n+1),
  article.panóptico:nth-of-type(3n+1):nth-last-child(3n),
  article.panóptico:nth-of-type(3n+2):nth-last-child(3n+2),
  article.panóptico:nth-of-type(3n):nth-last-child(3n+1) {
    width: calc(33% - 1.99em);
  }

  /* TODO: do we want to do this? */

  /*
   * |-------------------------------------|
   * |          |               |          |
   * |  6n + 1  |     6n + 2    |  6n + 3  |
   * |          |               |          |
   * |-------------------------------------|
   * |               |          |          |
   * |     6n + 4    |  6n + 5  |    6n    |
   * |               |          |          |
   * |-------------------------------------|
   */

  /*
   * |-------------------------------------|
   * |          |               |          |
   * |  6n + 1  |     6n + 2    |  6n + 3  |
   * |          |               |          |
   * |-------------------------------------|
   * |                  |                  |
   * |      6n + 4      |      6n + 5      |
   * |                  |                  |
   * |-------------------------------------|
   */

  /**************/
  /* MULTIMEDIA */
  /**************/

  article.multimedia {
    width: calc(33% - 1.99em);
  }
}