/* https://www.taggmaiwald.com/layout-textbook.css */
/* TEXTBOOK PAGE LAYOUT */
/* collapse for narrow viewports */
@media (max-width: 1039px) {
  .page-grid {
    display: block;
    padding: var(--page-padding-y) var(--page-padding-x);
  }
}

/* widescreen textbook layout */
@media (min-width: 1040px) {
  .page-grid {
    display: grid;
    grid-template-columns:
      [left-callout] 15%
      [core-start]   30%
      [elab-start]   40%
      [right-callout] 15%
      [end];
    gap: 1rem;
    width: 100%;
    padding: var(--page-padding-y) var(--page-padding-x);
    align-items: start;
  }

  /* conceptual column */
  .core {
    grid-column: core-start;
    max-width: 45ch;
  }

  /* elaboration / detail column */
  .elab {
    grid-column: elab-start;
    max-width: 65ch;
  }

  /* marginalia */
  .callout-left {
    grid-column: left-callout;
    max-width: 22ch;
  }

  .callout-right {
    grid-column: right-callout;
    max-width: 22ch;
  }

  /* full-width spans (figures, tables, section titles) */
  .span-full {
    grid-column: left-callout / end;
  }

  /* partial spans */
  .span-left45 {
    grid-column: left-callout / elab-start;
  }

  .span-right55 {
    grid-column: core-start / end;
  }
}