/* A quiet gift note, illustrated as a new page in Elior's storybook. */
.safari-gifts {
  position: relative;
  overflow: hidden;
  padding: 100px 6% 0;
  background: #fbf3e3;
  color: var(--ink);
  font-family: var(--story-font);
}
.gift-spread {
  max-width: 1140px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1.05fr;
  align-items: center;
  gap: clamp(40px, 6vw, 90px);
}
.gift-illustration { position: relative; margin: 0; text-align: center; }
.gift-illustration img { display: block; width: 100%; height: auto; }
.gift-art-note { display: block; font-size: 28px; transform: rotate(-5deg); color: #7a8156; }
.gift-illustration figcaption { font-size: 32px; transform: rotate(-3deg); margin-top: -18px; color: #7a8156; }
.gift-story .section-kicker { font-size: 14px; margin-bottom: 24px; }
.gift-story .section-kicker svg { stroke: var(--rust); }
.gift-story h2 {
  font: 600 clamp(56px, 5.8vw, 82px)/1.04 var(--story-font);
  letter-spacing: -4px;
  margin: 0 0 27px;
}
.gift-story h2 em { font-family: var(--serif); font-weight: 400; color: var(--rust); }
.gift-story > p { font-size: 19px; line-height: 1.75; color: #647052; margin: 0 0 18px; text-wrap: pretty; }
.gift-story > p strong { font-weight: 500; color: var(--ink); }
.gift-suggestions { margin: 25px 0 28px; }
.gift-suggestions h3 { font-size: 31px; margin: 0 0 13px; }
.gift-ideas { display: grid; grid-template-columns: 1fr 1fr; gap: 0 24px; list-style: none; margin: 0; padding: 0; }
.gift-ideas li { display: flex; align-items: center; gap: 12px; min-height: 85px; padding: 14px 0; border-bottom: 1px solid #a89b7640; font-size: 18px; line-height: 1.4; }
.gift-ideas svg { width: 32px; height: 32px; flex: 0 0 32px; color: var(--rust); stroke-width: 1.4; }
.gift-open { margin-top: 9px; min-height: 56px; font-size: 18px; gap: 26px; }
.gift-story > .gift-signature { font: 500 29px/1.25 var(--hand); color: var(--rust); margin: 27px 0 0; max-width: 375px; }
.gift-signature svg { width: 20px; height: 20px; vertical-align: middle; margin-left: 6px; stroke-width: 1.3; }
.gift-footnote { display: flex; align-items: center; justify-content: center; gap: 25px; max-width: 1140px; margin: 73px auto 0; padding: 27px 0; border-top: 1px solid #a89b7640; color: #8b8662; font: 500 25px/1.3 var(--hand); }
.gift-footnote svg { width: 17px; height: 17px; stroke-width: 1.1; }
.gift-dialog {
  box-sizing: border-box;
  width: min(460px, calc(100% - 28px));
  max-height: calc(100svh - 28px);
  overflow: auto;
  overscroll-behavior: contain;
  padding: 27px 30px 23px;
  border: 1px solid #b5ba9666;
  border-radius: 10px;
  background: #fffbef;
  color: var(--ink);
  text-align: center;
  font-family: var(--story-font);
  box-shadow: 0 25px 90px #16251635;
}
.gift-dialog::backdrop { background: #213b2abc; backdrop-filter: blur(6px); }
html:has(.gift-dialog[open]) { overflow: hidden; }
.gift-close { position: absolute; right: 12px; top: 12px; display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: transparent; color: var(--ink); font: 400 32px/1 var(--story-font); }
.gift-close:hover { background: #e9ecd9; }
.gift-dialog-kicker { display: block; margin: 13px 20px 15px; font-size: 12px; letter-spacing: 1.5px; color: #72815d; }
.gift-dialog h2 { font: 500 42px/1.04 var(--story-font); letter-spacing: -1.7px; margin: 0; outline: none; }
.gift-dialog h2 em { font-family: var(--serif); font-weight: 400; color: var(--rust); }
.gift-dialog > p { margin: 12px 0; font-size: 16px; line-height: 1.5; color: #667153; }
.gift-qr { width: min(269px, 100%); box-sizing: border-box; margin: 16px auto; padding: 6px 14px 16px; border: 1px solid #e0decb; border-radius: 5px; background: #fff; }
.gift-qr img { display: block; width: 241px; max-width: 100%; height: auto; margin: auto; }
.gift-qr figcaption { font-size: 16px; font-weight: 500; margin-top: -5px; color: #305d93; }
.gift-dialog > .gift-phone-note { max-width: 290px; margin: 0 auto 15px; font-size: 15px; }
.gift-download { width: 100%; min-height: 52px; padding-block: 10px; font-size: 17px; gap: 12px; justify-content: center; }
.gift-dialog > .gift-dialog-thanks { font: 500 25px/1.2 var(--hand); color: var(--rust); margin: 16px 0 0; }
.gift-open:focus-visible, .gift-download:focus-visible, .gift-close:focus-visible { outline: 3px solid var(--ochre); outline-offset: 4px; }
@media (max-width: 1100px) {
  .site-header nav { gap: 16px; }
  .gift-story h2 { font-size: 62px; letter-spacing: -3px; }
  .gift-story > p { font-size: 18px; }
}
@media (max-width: 760px) {
  .safari-gifts { padding: 68px 7% 0; }
  .gift-spread { grid-template-columns: 1fr; gap: 36px; max-width: 500px; }
  .gift-story { grid-row: 1; }
  .gift-story .section-kicker { font-size: 13px; margin-bottom: 20px; }
  .gift-story h2 { font-size: clamp(52px, 14vw, 67px); letter-spacing: -2.8px; margin-bottom: 25px; }
  .gift-story > p { font-size: 18px; line-height: 1.7; }
  .gift-suggestions h3 { font-size: 29px; }
  .gift-ideas { grid-template-columns: 1fr; }
  .gift-ideas li { min-height: 65px; font-size: 19px; gap: 15px; }
  .gift-ideas br { display: none; }
  .gift-ideas svg { width: 30px; height: 30px; flex-basis: 30px; }
  .gift-open { font-size: 17px; min-height: 55px; }
  .gift-story > .gift-signature { font-size: 27px; max-width: 310px; }
  .gift-illustration { width: min(100%, 370px); margin: 0 auto; }
  .gift-art-note { font-size: 25px; }
  .gift-illustration figcaption { font-size: 30px; margin-top: -10px; }
  .gift-footnote { gap: 16px; font-size: 22px; margin-top: 40px; padding: 24px 0; }
  .gift-footnote svg { width: 14px; height: 14px; flex-shrink: 0; }
  .gift-dialog { padding: 27px 22px 24px; }
}
@media (max-width: 360px) {
  .gift-story h2 { font-size: 50px; }
  .gift-dialog { padding-left: 17px; padding-right: 17px; }
  .gift-dialog h2 { font-size: 37px; }
  .gift-dialog-kicker { font-size: 10px; letter-spacing: 1px; }
  .gift-qr { padding: 5px 6px 15px; }
  .gift-footnote { gap: 10px; font-size: 20px; }
}