@page {
  size: A4;
  margin: 0;
}

@media print {
  /* Hide header elements */
  head,
  head * {
    display: none !important;
  }

  /* Reset hero blocks */
  .section--content__block--hero:has(img) {
    margin-top: unset !important;
  }

  h1 {
    position: relative !important;
    top: unset !important;
    left: unset !important;
    transform: unset !important;
  }

  /* Show list items properly */
  ol li,
  ul li {
    display: list-item !important;
  }

  /* Hide figures */
  figure {
    display: none !important;
  }

  /* Global resets */
  * {
    text-align: left !important;
    border: none !important;
    background: none !important;
    font-family: Atkinson !important;
    color: black !important;
    padding: 0 !important;
    margin: 0 !important;
    display: block !important;
  }

  /* Make inline elements actually inline */
  span,
  strong,
  em,
  a {
    display: inline !important;
  }

  /* PAGE BREAK LOGIC */
  /* First section (heading) should be within A5 bounds and group with first content */
  .main-content > section:first-child {
    page-break-after: avoid;
    width: 148mm !important;
    max-width: 148mm !important;
    padding: 15mm !important;
    padding-bottom: 0 !important;
    box-sizing: border-box !important;
    position: relative !important;
    margin: 43.5mm 0 0 0 !important;
    left: 52% !important;
    transform: translateX(-50%) !important;
  }

  /* Keep first child of second section with heading above */
  .main-content > section:nth-child(2) > *:first-child {
    page-break-before: avoid;
    page-break-after: avoid;
  }

  /* Force second child of second section to new page */
  .main-content > section:nth-child(2) > *:nth-child(2) {
    page-break-before: always;
  }

  /* Assignment always on new page */
  .assignment {
    page-break-before: always;
    page-break-inside: avoid;
  }

  /* Allow other content to flow normally */
  .section--content:not(.assignment) {
    page-break-inside: auto;
  }

  /* Body setup for A4 */
  body {
    width: 210mm;
    height: 297mm;
    margin: 0 !important;
    padding: 0 !important;
    position: relative;
  }

  /* Disable grid layouts */
  html,
  body,
  main,
  .grid-container {
    margin: 0 !important;
    padding: 0 !important;
  }

  .grid-container,
  main.grid-container {
    display: block !important;
    grid-template-columns: none !important;
    gap: 0 !important;
    max-width: none !important;
  }

  .main-content {
    display: block !important;
    grid-template-columns: none !important;
    grid-column: unset !important;
  }

  /* A5 CUT AREA BORDER - Single complete rectangle outline */
  body::before {
    content: "";
    pointer-events: none;
    position: fixed;
    z-index: 1000;
    top: 43.5mm;
    left: 31mm;
    width: 148mm;
    height: 210mm;
    border: 0.5mm dashed #666;
    box-sizing: border-box;
  }

  /* Remove other pseudo-elements */
  body::after,
  html::before,
  html::after {
    display: none !important;
  }

  /* PUNCH HOLES - Using html pseudo-elements */
  .section--content:nth-of-type(2) {
    position: relative !important;
    overflow: visible !important; /* allow negative top pseudo-elements to show */
  }

  /* Punch holes */
  .section--content:nth-of-type(2):before,
  .section--content:nth-of-type(2)::after {
    content: "";
    position: absolute;
    top: 0;
    left: 3mm; /* horizontal position of holes */
    width: 6mm;
    height: 6mm;
    background: white;
    border: 0.5mm solid #666;
    border-radius: 50%;
    z-index: 1000;
  }

  /* First hole above the section */
  .section--content:nth-of-type(2)::before {
    top: calc(65mm - 35.19px - 56.693px); /* = -26.883mm */
  }

  /* Second hole inside the section */
  .section--content:nth-of-type(2)::after {
    top: calc(145mm - 35.19px - 56.693px); /* = 53.117mm */
  }

  /* CONTENT CONTAINER - Regular content (description, etc.) */
  .section--content:not(.assignment),
  .main-content > section:nth-child(2) {
    width: 148mm !important;
    max-width: 148mm !important;
    padding: 15mm !important;
    padding-top: 0 !important;
    box-sizing: border-box !important;
    position: relative !important;

    /* Center at 50% - normal centered position */
    margin: 0 !important;
    left: 52% !important;
    transform: translateX(-50%) !important;
  }

  /* First section already styled above, ensure it continues to second section */
  .main-content > section:nth-child(2) {
    margin-top: 0 !important;
  }

  /* ASSIGNMENT CONTAINER - Offset position */
  .assignment {
    width: 148mm !important;
    max-width: 148mm !important;
    min-height: 210mm !important;
    padding: 15mm !important;
    box-sizing: border-box !important;
    position: relative !important;

    /* Offset at 40% - intentionally off-center */
    margin: 43.5mm 0 !important;
    left: 40% !important;
    transform: translateX(-50%) !important;
  }

  /* Ensure content respects A5 boundaries with adjusted padding */
  .section--content > * {
    max-width: 108mm !important; /* 148mm - (25mm left + 15mm right padding) */
    box-sizing: border-box !important;
  }

  .main-content > section:first-child > *,
  .main-content > section:nth-child(2) > * {
    max-width: 128mm !important; /* Account for 25mm left padding + 15mm right */
  }

  /* Typography */
  h1 {
    font-size: 1.375rem !important;
    margin-bottom: 1rem !important;
  }

  h2 {
    font-size: 1.25rem !important;
    margin-bottom: 0.75rem !important;
  }

  h3 {
    font-size: 1.125rem !important;
    margin-bottom: 0.5rem !important;
  }

  h4 {
    font-size: 1.075rem !important;
  }

  p,
  li {
    font-size: 0.875rem !important;
    line-height: 1.4 !important;
    margin-bottom: 0.5rem !important;
  }

  a {
    font-weight: 500 !important;
    font-size: inherit !important;
    line-height: inherit !important;
  }

  /* List spacing */
  ul,
  ol {
    margin-top: 0.5rem !important;
    margin-bottom: 0.75rem !important;
    padding-left: 0 !important;
  }

  li + li {
    margin-top: 0.25rem !important;
  }

  /* Responsive scaling */
  @supports (font-size: clamp(1rem, 1vw, 2rem)) {
    h1 {
      font-size: clamp(1rem, 1.375rem, 1.5rem) !important;
    }

    h2 {
      font-size: clamp(0.9rem, 1.25rem, 1.375rem) !important;
    }

    h3 {
      font-size: clamp(0.85rem, 1.125rem, 1.25rem) !important;
    }

    p,
    li {
      font-size: clamp(0.75rem, 0.875rem, 1rem) !important;
      line-height: clamp(1.3, 1.4, 1.5) !important;
    }
  }

  /* Hide unnecessary elements */
  .no-print,
  button,
  body > header,
  body > footer,
  .section--content__block--intro {
    display: none !important;
  }

  .print-all {
    display: block !important;
  }

  .print-all.no-print {
    display: none !important;
  }

  html:nth-child(2)::before {
    background-color: red;
  }

  html:nth-of-type(2)::before {
    background-color: lime;
  }
}