/* Shipping and questions. */
.shiphead { padding: clamp(56px, 8vw, 112px) var(--gutter) clamp(48px, 6vw, 80px); display: grid; gap: 18px; }
.shiphead h1 { font-size: clamp(3rem, 8.4vw, 7.6rem); line-height: .86; max-width: 12ch; color: var(--field-ink); }
.shiphead__lead { font-size: clamp(1.125rem, 1.6vw, 1.35rem); max-width: 40ch; font-weight: 500; }

.cal { padding: clamp(56px, 8vw, 104px) var(--gutter); display: grid; gap: 22px; }
.cal__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 24px; }
.cal h2 { font-size: clamp(2.2rem, 4.4vw, 4rem); }
.cal__note { color: var(--ink-soft); }
.cal .week { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.cal .week li:nth-child(n+8) { border-top: 2px solid rgba(30, 13, 11, .18); }
.cal .week li:nth-child(8) { border-left: 0; }
.cal__next { font: 700 1.3rem/1.35 var(--text); }

.cost { padding: 0 var(--gutter) clamp(56px, 8vw, 104px); display: grid; gap: 22px; }
.cost h2 { font-size: clamp(2.2rem, 4.4vw, 4rem); }
.cost__figures { display: grid; grid-template-columns: 1fr 1fr; border-top: 3px solid var(--ink); border-bottom: 3px solid var(--ink); }
.cost__fig { display: grid; gap: 6px; padding: 26px 0; }
.cost__fig--free { padding-left: clamp(20px, 4vw, 56px); border-left: 2px solid rgba(30, 13, 11, .2); }
.cost__big { font: 400 clamp(3.2rem, 8vw, 7rem)/.9 var(--display); color: var(--roast); }
.cost__label { font-weight: 700; font-size: 1.125rem; }
.cost__ex { margin-top: 8px; color: var(--roast); }
.cost__list { display: grid; gap: 4px; }
.cost__list li { padding: 12px 0; border-bottom: 1px solid rgba(30, 13, 11, .16); font-size: 1.0625rem; font-weight: 600; }

.pack { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 32px 64px; padding: clamp(56px, 8vw, 112px) var(--gutter); }
.pack__pic { width: min(100%, 460px); justify-self: center; }
.pack__text { display: grid; gap: 16px; max-width: 30rem; }
.pack h2 { font-size: clamp(2.4rem, 5vw, 4.6rem); color: var(--marigold); }
.pack p { font-size: 1.2rem; }

.faq { padding: clamp(56px, 8vw, 112px) var(--gutter); display: grid; gap: 24px; justify-items: start; }
.faq h2 { font-size: clamp(2.4rem, 5vw, 4.6rem); }
.faq__list { width: 100%; max-width: 56rem; border-top: 3px solid var(--ink); }
.faq__item { border-bottom: 1px solid rgba(30, 13, 11, .22); }
.faq__item summary {
  display: flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 64px; padding: 14px 0;
  font: 400 clamp(1.3rem, 2vw, 1.7rem)/1.15 var(--display); cursor: pointer; list-style: none;
  transition: color .2s var(--ease);
}
.faq__item summary::-webkit-details-marker { display: none; }
.faq__item summary::after { content: "+"; flex: none; width: 36px; height: 36px; display: grid; place-items: center; border: 2px solid currentColor; font: 700 1.2rem/1 var(--text); transition: transform .25s var(--ease); }
.faq__item[open] summary::after { transform: rotate(45deg); }
.faq__item summary:hover { color: var(--roast); }
.faq__item p { padding: 0 0 22px; max-width: 60ch; font-size: 1.0625rem; }

@media (max-width: 899px) {
  .cost__figures { grid-template-columns: 1fr; }
  .cost__fig--free { padding-left: 0; border-left: 0; border-top: 2px solid rgba(30, 13, 11, .2); }
  .pack { grid-template-columns: 1fr; }
  .pack__pic { width: 86%; }
}
