/* A paper field guide, kept as crisp, accessible HTML rather than a bitmap. */
.curriculum-aside {
  container-type: inline-size;
  min-width: 0;
  padding: 8px 5px 0;
}

.field-note.field-note-standard {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  min-height: 410px;
  min-height: clamp(350px, 119cqw, 460px);
  padding: 24px 25px 23px;
  overflow: hidden;
  color: #294a2d;
  background-color: #d9e5c5;
  background-image:
    linear-gradient(#6b875515 1px, transparent 1px),
    linear-gradient(90deg, #6b875515 1px, transparent 1px),
    linear-gradient(145deg, #eff2cf22, #c0d29e16);
  background-size: 27px 27px, 27px 27px, 100% 100%;
  background-position: 11px 9px, 11px 9px, 0 0;
  border: 1px solid #9caf8866;
  border-radius: 2px;
  box-shadow: 7px 8px 0 #cbd2bd, 0 10px 22px #263a1c0b;
  transform: rotate(-2.5deg);
  transform-origin: 50% 50%;
}

.field-note-standard .field-note-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding-bottom: 16px;
  border-bottom: 1px solid #4c6e4b70;
  font: 500 12px/1.5 var(--sans);
  letter-spacing: .025em;
  color: #48633e;
}

.field-note-standard .field-note-meta > span {
  white-space: nowrap;
}

.field-note-standard .field-note-arrow {
  position: absolute;
  z-index: -1;
  top: 40px;
  right: 11px;
  color: #6c905141;
  font: 200 176px/1 var(--sans);
  transform: rotate(1deg);
  pointer-events: none;
  user-select: none;
}

.field-note.field-note-standard > .field-note-title {
  position: relative;
  flex: 1;
  margin: 64px 0 35px;
  font-family: var(--sans);
  font-size: 44px;
  font-size: clamp(31px, 12.8cqw, 51px);
  font-weight: 750;
  line-height: 1.13;
  letter-spacing: -.055em;
  white-space: nowrap;
  overflow-wrap: normal;
  color: #284d2e;
}

.field-note-standard .field-note-footer {
  padding-top: 16px;
  border-top: 1px solid #4c6e4b70;
}

.field-note-standard .field-note-footer > p {
  font-size: 15px;
  line-height: 1.75;
  font-weight: 600;
  letter-spacing: -.025em;
}

.field-note-standard .field-note-footer > span {
  display: block;
  margin-top: 7px;
  color: #567247;
  font: 500 12px/1.6 var(--sans);
  letter-spacing: .035em;
}

.curriculum-aside > .aside-note {
  margin-top: 36px;
}

@media (min-width: 961px) and (max-width: 1150px) {
  .field-note.field-note-standard {
    padding-inline: 19px;
  }

  .field-note-standard .field-note-meta {
    gap: 10px;
    letter-spacing: 0;
  }

  .field-note-standard .field-note-arrow {
    font-size: 151px;
  }

  .field-note.field-note-standard > .field-note-title {
    margin-top: 57px;
  }
}

@media (max-width: 960px) {
  .curriculum-layout {
    row-gap: 36px;
  }

  .curriculum-aside {
    display: block;
    position: static;
    width: min(340px, calc(100% - 26px));
    margin: 10px auto 14px;
    padding: 0;
  }

  .field-note.field-note-standard {
    min-height: 355px;
    padding: 23px 24px 21px;
  }

  .field-note.field-note-standard > .field-note-title {
    margin-top: 50px;
    margin-bottom: 28px;
  }

  .curriculum-aside > .aside-note {
    display: none;
  }
}

@media (max-width: 380px) {
  .field-note.field-note-standard {
    min-height: 330px;
    padding-inline: 19px;
  }

  .field-note-standard .field-note-meta {
    gap: 8px;
    letter-spacing: 0;
  }

  .field-note-standard .field-note-arrow {
    font-size: 147px;
  }

  .field-note.field-note-standard > .field-note-title {
    margin-top: 43px;
  }
}